Question

我最近一直在努力使用JavaScript的计算器概念。我已经尝试了很多东西，但却无法让它发挥作用。

计算器有三个下拉列表：一个用于第一个数字（0-9），一个用于操作，一个用于第二个数字（也是0-9）。基本上，按下＆＃34;执行公式＆＃34;按钮，它获取下拉列表的值，并假设将所有这些值相加，执行一个等式。这是一个简短的例子。

<select id="n1">
<option value="0">0</option>
<option value="1">1</option>
</select>

<select id="op">
<option value="+">0</option>
<option value="-">1</option>
</select>


<select id="n2">
<option value="0">0</option>
<option value="1">1</option>
</select>
<input type="button" value="Perform Equation" onclick="perform"/>

<p id="printE"/>

<script>
function perform() {
var analyseN1 = document.getElementById("n1").value
var analyseOp = document.getElementById("op").value
var analyseN2 = document.getElementById("n2").value
var addUp = analyseN1+analyseOp+analyseN2;
document.getElementById("printE").innerHTML= addUp;
}
</script>

正如你所看到的，我得到了所有下拉的值，＆＃34;将它们加起来＆＃34;然后打印最终结果。但是，它无法正常工作。有人可以告诉我为什么吗？我，嗯，不是最好的JavaScript。我很年轻，几个月前才开始接触这种语言。所以，是的，如果你知道答案，那么如果你能告诉我那就太棒了。谢谢！

Answer 1

要实际执行计算，您需要比此更多的代码。

您现在正在做的是获取n1，op和n2元素的值。然后，你基本上将这些字符串组合成一个结果。

要获取n1和n2字符串的数值，您需要使用parseInt：

function perform() {
    var analyseN1 = parseInt(document.getElementById("n1").value, 10);
    var analyseOp = document.getElementById("op").value
    var analyseN2 = parseInt(document.getElementById("n2").value, 10);

从MDN页面：
parseInt()函数解析字符串参数并返回指定基数或基数的整数。

然后，要使用正确的运算符，根据下拉菜单，您需要将analyseOp值与"+"和"-"字符串进行比较：< / p>

    var addUp;
    if(analyseOp === '+'){
        addUp = analyseN1 + analyseN2;
    }else if(analyseOp === '-'){
        addUp = analyseN1 - analyseN2;
    }

    document.getElementById("printE").innerHTML= addUp;
}

Answer 2

这里有几个问题。一个是+在Javascript中有两个含义。对于数字，它意味着＆＃34;加＆＃34;，就像你想要的那样。但是，对于字符串，它表示＆＃34;连接＆＃34;。

所以1 + 1 = 2，但"1" + "1" = "11"。

当您从<select>元素中获取值时，它们将被检索为字符串，因此您需要使用parseInt将它们解析为整数：

var analyseN1 = parseInt(document.getElementById("n1").value);
var analyseN2 = parseInt(document.getElementById("n2").value);

另一个问题是，为了建立你的等式，你真正构建了一串代码来运行。使用eval()运行一串代码可以，但它非常不安全，所以没有人会推荐它！

你最终可能不得不这样做：

// Get the numbers from the selects, and the operator
var analyseN1 = parseInt(document.getElementById("n1").value);
var analyseOp = document.getElementById("op").value
var analyseN2 = parseInt(document.getElementById("n2").value);

// Add or subtract the numbers, depending on the selected operator
var addUp;
if(analyseOp == "+"){
  addUp = analyseN1 + analyseN2;
}else{
  addup = analyseN1 - analyseN2;
}

以下是您应该避免使用eval()的原因，即使它是您问题的最直接答案： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval#Don.27t_use_eval.21

将变量加在一起以执行数学方程式

2 个答案: