用js實現簡易計算器（只能實現加減乘除）

<mce:script type="text/javascript"><!-- function operation(flag) { fl = flag; switch(flag) { case "+": doAdd();break; case "-": doMinus();break; case "*": doMultiply();break; case "/": doDivide();break; } } var num1; var num2; var isPass = true; var result; var fl; function getValue() { isPass =true; num1 =document.getElementById("txtNum1").value; num2 = document.getElementById("txtNum2").value; result = document.getElementById("txtResult"); checkVal(); } function checkVal() { if(num1=="" || num2=="") { alert("不能爲空"); isPass = false; }else { if(num1!=0) { if(!Number(num1)) { isPass = false; } } if(fl=="/") { if(num2 == 0) { alert("除數不能爲0"); isPass = false; } } if(fl!="/"){ if(num2!=0){ if(!Number(num2)) { alert("請輸入數字"); isPass = false; } } } } } //加法 function doAdd() { getValue(); if(isPass) { result.value =Number(num1)+Number(num2); } } //減法 function doMinus() { getValue(); if(isPass) { result.value =Number(num1)-Number(num2); } } //乘法 function doMultiply(){ getValue(); if(isPass) { result.value =Number(num1)*Number(num2); } } //除法 function doDivide(){ getValue(); if(isPass) { result.value =Number(num1)/Number(num2); } } function clearValue() { document.getElementById("txtNum1").value = ""; document.getElementById("txtNum2").value = ""; document.getElementById("txtResult").value = ""; } // --></mce:script>

<div style="z-index: 101; left: 134px; position: absolute; top: 55px; height: 98px"> <table style="width: 80%; height: 92px"> <tr> <td colspan="3" style="background-image: url(images/logo.gif); background-repeat: no-repeat; height: 37px; padding-left: 230px;">      歡迎您來到淘寶！</td> </tr> <tr style="background-color: #33cccc;" mce_style="background-color: #33cccc;"> <td style="background-image: url(images/shop.gif); width: 111px; background-repeat: no-repeat; height: 61px;"> </td> <td colspan="2" style="height: 61px"> 購物簡易計算器</td> </tr> <tr style="background-color: #33cccc;" mce_style="background-color: #33cccc;"> <td style="width: 111px"> 第一個數：</td> <td colspan="2"> <input id="txtNum1" type="text" /></td> </tr> <tr style="background-color: #33cccc;" mce_style="background-color: #33cccc;"> <td style="width: 111px"> 第二個數：</td> <td colspan="2"> <input id="txtNum2" type="text" /></td> </tr> <tr style="background-color: #33cccc;" mce_style="background-color: #33cccc;"> <td colspan="3" style="height: 26px"> <input id="btnAdd" style="width: 63px" type="button" value="＋" onclick="operation('+');" /> <input id="btnMinus" style="width: 63px" type="button" value="－" onclick="operation('-');" /> <input id="btnMultiply" style="width: 63px" type="button" value="*" onclick="operation('*');" /> <input id="btnDivide" style="width: 63px" type="button" value="/" onclick="operation('/');" /> <input id="btnClear" type="button" style="width: 63px" value="清空" onclick="clearValue();" /></td> </tr> <tr style="background-color: #33cccc;" mce_style="background-color: #33cccc;"> <td colspan="3" style="height: 26px"> 計算結果：<input id="txtResult" readonly="readonly" type="text" /></td> </tr> </table> </div>

 

有什麼好的建議或問題還請各位朋友指出，謝謝。