Javascript:简单的添加程序无法正常工作

时间:2015-09-14 10:13:14

标签: javascript html

我正在尝试创建一个程序,单击按钮时会添加两个数字。

然而,它不起作用,我完全糊涂了什么是错的。在这个程序中,用户应输入2个数字,程序会为用户提供点击的总和。

以下是代码:

<html>

    <body>
        <p>For adding two numbers</p>

        <button onclick="myFunction()">Calculate</button>
        <br/>
        <input type="text" placeholder="1st number" id="1st" name="txt1">
        <br/>+
        <br/>
        <input type="text" placeholder="2nd number" id="2nd" name="txt2">

        <p id="demo"></p>

        <script>
        function myFunction() {
            var a = document.getElementById("1st").value;
            var b = document.getElementById("2nd").value;
            var c = number(a) + number(b);

            document.getElementById("demo").innerHTML = c;
        }
        </script>
    </body>

</html>

2 个答案:

答案 0 :(得分:2)

n中的number应为大写。 number应为Number

Demo

function myFunction() {
  var a = document.getElementById("1st").value;
  var b = document.getElementById("2nd").value;
  var c = Number(a) + Number(b);

  document.getElementById("demo").innerHTML = c;
}
<button onclick="myFunction()">Calculate</button>
<br/>
<input type="text" placeholder="1st number" id="1st" name="txt1">
<br/>+
<br/>
<input type="text" placeholder="2nd number" id="2nd" name="txt2">
<p id="demo"></p>

答案 1 :(得分:2)

根据W3Schools

  

定义和用法Number()函数转换对象   表示对象值的数字的参数。

     

如果无法将值转换为合法号码,则返回NaN。

语法Number()功能:

Number(object)

此处提供对象。如果没有,则返回

所以在您的代码段中

var c = number(a) + number(b) ;

你只需用

更改它
var c = Number(a) + Number(b) ;