如何在不使用 eval 的情况下使用 JavaScript 的功能来创建计算器?



这有点乱,但我需要JavaScript的函数来计算。我避免使用eval,因为我的老师没有教过。能帮我吗?

function A7() {
var num = document.getElementById(7).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A8() {
var num = document.getElementById(8).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A9() {
var num = document.getElementById(9).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A10() {
var num = document.getElementById(10).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A4() {
var num = document.getElementById(4).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A5() {
var num = document.getElementById(5).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A6() {
var num = document.getElementById(6).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A11() {
var num = document.getElementById(11).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A1() {
var num = document.getElementById(1).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A2() {
var num = document.getElementById(2).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A3() {
var num = document.getElementById(3).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A12() {
var num = document.getElementById(12).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
function A0() {
var num = document.getElementById(0).value;
document.getElementById("display").value = document.getElementById("display").value + num
}
var firstNum = getElementById(display);
document.getElementById("display").value = document.getElementById("display").value + num
var secondNum = getElementById(display);
document.getElementById("display").value = document.getElementById("display").value + num
operation = "";
function calculate() {
if (operation = "+") {
firstNum + secondNum;
document.getElementById("display").value = firstNum + secondNum;
} else if (operation = "-") {
firstNum - secondNum;
document.getElementById("display").value = firstNum - secondNum;
} else if (operation = "/") {
firstNum / secondNum;
document.getElementById("display").value = firstNum / secondNum;
else {
firstNum * secondNum;
document.getElementById("display").value = firstNum * secondNum;
}
}
<BODY>
<form>
<TABLE>
<TR>
<TD COLSPAN="4">
<INPUT TYPE="text" ID="display" style="text-align:right">
</TD>
</TR>
<TR>
<TD>
<INPUT TYPE="BUTTON" VALUE="7" ID="7" onclick="A7()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="8" ID="8" onclick="A8()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="9" ID="9" onclick="A9()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="/" ID="10" onclick="A10()">
</TD>
</TR>
<TR>
<TD>
<INPUT TYPE="BUTTON" VALUE="4" ID="4" onclick="A4()"> </TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="5" ID="5" onclick="A5()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="6" ID="6" onclick="A6()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="*" ID="11" onclick="A11()">
</TD>
</TR>
<TD>
<INPUT TYPE="BUTTON" VALUE="1" ID="1" onclick="A1()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="2" ID="2" onclick="A2()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="3" ID="3" onclick="A3()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="-" ID="12" onclick="A12()">
</TD>
<TR>
<TD>
<INPUT TYPE="BUTTON" VALUE="0" ID="0" onclick="A0()">
</TD>
<TD>
<INPUT TYPE="reset" VALUE="C" ID="C">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="=" ID="14" onclick="calculate()">
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="+" ID="13" onclick="A13()">
</TD>
</TR>
</BODY>

calculate()需要解析display字段来获得这两个数字和运算。您可以使用一个简单的正则表达式来完成此操作。

此外,您需要使用==来比较字符串,而不是使用=来进行分配。

写这样的行没有意义

firstNum + secondNum;

这会计算总和,但不会对其执行任何操作。您只需要将计算结果分配给display值的行。

function calculate() {
var input = document.getElementById("display").value.match(/^(d+)([+-*/])(d+)$/);
if (!input) {
alert("Nothing to calculate");
return;
}
var firstNum = parseInt(input[1]);
var operation = input[2];
var secondNum = parseInt(input[3]);
if (operation == "+") {
document.getElementById("display").value = firstNum + secondNum;
} else if (operation == "-") {
document.getElementById("display").value = firstNum - secondNum;
} else if (operation == "/") {
document.getElementById("display").value = firstNum / secondNum;
} else {
document.getElementById("display").value = firstNum * secondNum;
}
}

最新更新