Question

因此，在我的JavaScript网络应用计算器中，添加效果很好。但是，当我尝试对减法计算器进行编码时，一切都正常，除了当我尝试计算器时，加法工作正常，但当我尝试减去两个数字时，它只是说：NaN 这是我的计算器。减法计算器从“减法计算器！”的段落开始。

这是我的代码：

<!DOCTYPE html>
<html>
<body>
    <p>Addition Calculator!</p>
    <input id="n1" value=""/>
    <input id="n2" value=""/>
<button type="button" onclick="myFunction()">Submit</button>
    <p id="answer"></p>
    <script>
    function myFunction() {

        var n1=document.getElementById("n1").value;

        var n2=document.getElementById("n2").value;
        answer = ( Number(n1) + Number(n2) );

        document.getElementById("answer").innerHTML=answer;
    }


    </script>
    <p>Subtraction Calculator!</p>
    <input id="sn1" value=""/>
    <input id="sn2" value=""/>
    <button type="button" onclick="subtract()">Submit</button>
    <p id="sanswer"></p>

    <script>
    function subtract() {
        var sn1=document.getElementById("sn1").value;
        var sn1=document.getElementById("sn2").value;
        stotal = ( Number(sn1) - Number(sn2) );
        document.getElementById("sanswer").innerHTML=stotal;
    }


    </script>


    </body>

</html>

Answer 1

问题在于这一行：

var sn1=document.getElementById("sn2").value;

您有一个错误，即您正在创建第二个sn1变量而不是sn2。这就意味着这一行：

stotal = ( Number(sn1) - Number(sn2) );

...当您使用sn2时，您可能会发现引用错误，但浏览器会选择使用id="sn2"的元素，并在NaN运行时提供Number()功能。涉及NaN的减法会产生Nan。

所以，让它sn2 = ...，它会没事的。

（注意作为一般规则，最好不要使用与元素ID相同的变量名，因为这样你就不会意外地得到这种“怪异”的行为。）

工作演示：http://jsbin.com/ivobew/1/edit

Answer 2

错误名称变量：

function subtract() {
        var sn1=document.getElementById("sn1").value;
        var sn1=document.getElementById("sn2").value;
        stotal = ( Number(sn1) - Number(sn2) );
        document.getElementById("sanswer").innerHTML=stotal;
    }

第二个sn1应为sn2。

JavaScript中的减法问题

2 个答案: