这篇文章介绍的内容是关于js代码实现计算器,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script> function myjs(){ var ft = document.getElementById("fhv").value; var v1 = document.getElementById("v1").value; var v2 = document.getElementById("v2").value; var v3 = ''; //alert(ft); //alert(v1); //alert(v2); //alert(v3); if("+" == ft){ v3 = Number(v1) +Number(v2); }else if("-" == ft){ v3 = Number(v1)-Number(v2); }else if("*" == ft){ v3 = Number(v1)*Number(v2); }else if("/" == ft){ v3 = Number(v1)/Number(v2); }else{ v3 = ''; } //alert(v3); document.getElementById("v3").value= v3; document.getElementById("z3").innerHTML = v3; } function changeFh(){ var fu = document.getElementById("fh"); var idx= fu.selectedIndex ; var ft = fu.options[idx].value; var fs = fu.options[idx].text; //alert(ft == "+"); if("+" == ft){ document.getElementById("an").innerHTML= '加'; document.getElementById("fhv").value= '+'; }else if("-" == ft){ document.getElementById("an").innerHTML= '减'; document.getElementById("fhv").value= '-'; }else if("*" == ft){ document.getElementById("an").innerHTML= '乘'; document.getElementById("fhv").value= '*'; }else if("/" == ft){ document.getElementById("an").innerHTML= '除'; document.getElementById("fhv").value= '/'; }else{ document.getElementById("an").innerHTML= '请选择符号'; document.getElementById("fhv").value= ''; } var v1 = document.getElementById("v1").value; v1 = v1.replace(/\s+/g,""); if(v1.length == 0){ document.getElementById("fhz").innerHTML = ''; } } function radow_load(){ changeFh(); } function checkValue1(){ var v1 = document.getElementById("v1").value; v1 = v1.replace(/\s+/g,""); //alert(isNaN(v1)); if(isNaN(v1)){ document.getElementById("v1").value = "" ; alert("请输入数字!"); } document.getElementById("z1").innerHTML = v1; } function checkValue2(){ var v2 = document.getElementById("v2").value; v2 = v2.replace(/\s+/g,""); if(isNaN(v2)){ document.getElementById("v2").value = ''; alert("请输入数字"); } var fhx = document.getElementById("fhv").value; if(fhx.length == 0){ document.getElementById("v2").value = ''; alert("请输入符号"); return; } document.getElementById("fhz").innerHTML = fhx; document.getElementById("z2").innerHTML = v2; document.getElementById("fhzy").innerHTML = '='; } function clearValue(){ //alert("clear"); document.getElementById("v1").value= ''; document.getElementById("v2").value= ''; document.getElementById("v3").value= ''; document.getElementById("fhv").value= ''; document.getElementById("fh").value= ''; document.getElementById("fhz").value= ''; document.getElementById("an").innerHTML= '请选择符号'; document.getElementById("z1").innerHTML= ''; document.getElementById("z2").innerHTML= ''; document.getElementById("z3").innerHTML= ''; document.getElementById("fhzy").innerHTML= ''; document.getElementById("fhz").innerHTML= ''; } </script> </head> <body onload="radow_load()"> <h1>我的 Web 页面</h1> <table> <tr> <td> <input id="v1" name="第一个值" onchange="checkValue1()"/> <select id="fh" name="符号" onchange="changeFh()" > <option value ="+">+</option> <option value ="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> <input id="v2" name="第二个值" onchange="checkValue2()"/> <b>=</b> <input id="v3" name="结果"/> <button id="an" type="button" onclick="myjs()">请选择符号</button> <button id="ca" type="button" onclick="clearValue()">清空</button> <input id="fhv" name="fhv" hidden="true"/> </td> </tr> <tr> <td> <b id="z1"></b> <b id="fhz"></b> <b id="z2"></b> <b id="fhzy"></b> <b id="z3"></b> </td> </tr> </table> </body> </html>
相关推荐:
以上是js代码实现计算器的详细内容。更多信息请关注PHP中文网其他相关文章!