Question

我正在添加两个数字，但我没有得到正确的值。

例如，执行1 + 2会返回12而不是3

我在这段代码中做错了什么？

function myFunction() {
  var y = document.getElementById("txt1").value;
  var z = document.getElementById("txt2").value;
  var x = y + z;
  document.getElementById("demo").innerHTML = x;
}

<p>
  Click the button to calculate x.
  <button onclick="myFunction()">Try it</button>
</p>
<p>
  Enter first number:
  <input type="text" id="txt1" name="text1" value="1">
  Enter second number:
  <input type="text" id="txt2" name="text2" value="2">
</p>
<p id="demo"></p>

Answer 1

它们实际上是字符串而不是数字。从字符串生成数字的最简单方法是在+之前添加前缀：

var x = +y + +z;

Answer 2

我只使用Number()：

var i=2;  
var j=3;  
var k = Number(i) + Number(j); // 5

Answer 3

您需要使用javaScript的parseInt()方法将字符串转换回数字。现在它们是字符串，所以添加两个字符串连接它们，这就是你得到“12”的原因。

Answer 4

使用parseInt(...)但请确保指定基数值;否则你会遇到几个错误（如果字符串以“0”开头，基数是八进制/ 8等）。

var x = parseInt(stringValueX, 10);
var y = parseInt(stringValueY, 10);

alert(x + y);

希望这有帮助！

Answer 5

boss只需添加一个简单的类型转换方法，因为输入是在文本中进行的使用以下

    var y = parseInt(document.getElementById("txt1").value);
    var z = parseInt(document.getElementById("txt2").value);
    var x = y + z;

Answer 6

简单

var result = parseInt("1") + parseInt("2");
console.log(result ); // Outputs 3

Answer 7

这不会总结数字，而是将它连接起来：

var x = y + z;

您需要做的是：

var x = (y)+(z);

您必须使用parseInt才能指定对数字的操作。例如：

var x = parseInt(y) + parseInt(z); [final soulution, as everything us]

Answer 8

此代码对两个变量求和！把它放到你的功能

var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var x = (y +z);
document.getElementById("demo").innerHTML = x;`

Answer 9

这是一个老问题，但以下内容可能有用。

首先，HTML表单字段仅限于 text 。这尤其适用于文本框，即使您已经努力确保值看起来像一样。
其次，无论好坏，JavaScript都会使+运算符重载两个含义：它会添加数字，并且会连接字符串。它优先连接，所以即使像3+'4'这样的表达式也会被视为连接。
第三，如果可以的话，JavaScript会尝试动态更改类型，如果需要的话。例如，'2'*'3'会将两种类型都更改为数字，因为您无法将字符串相乘。如果其中一个不兼容，您将获得NaN，而不是数字。

出现问题是因为来自表单的数据被视为字符串，因此+将连接而不是添加。

从表单中读取所谓的数字数据时，应始终将其推送到parseInt()或parseFloat()，具体取决于您是想要整数还是小数。

请注意，这两个函数都不是将字符串转换为数字。相反，它将从左到右解析字符串，直到它到达无效的数字字符或结束并转换已接受的字符串。在parseFloat的情况下，包括一个小数点，但不包括两个小数点。

有效号码后的任何内容都会被忽略。它们失败的地方是字符串甚至不作为数字开始。然后你会得到NaN。

表单中数字的一个很好的通用技术是这样的：

var data=parseInt(form['data'].value);  //  or parseFloat

如果您准备将无效字符串合并为0，则可以使用：

var data=parseInt(form['data'].value) || 0;

Answer 10

试试这个

<!DOCTYPE html>
<html>
<body>

<p> Add Section </p>

<label>First No :</label>
<input id="txt1"  type="text"/><br />
<label>Second No :</label>
<input id="txt2"  type="text"/><br />

<input type="button" name="Add" value="Add" onclick="addTwoNumber()"/>
<p id="demo"></p>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = Date();
}

function addTwoNumber(){
    var a = document.getElementById("txt1").value;
    var b = document.getElementById("txt2").value;

    var x = Number(a) + Number(b);
    document.getElementById("demo").innerHTML = "Add Value: " + x;
}
</script>

</body>
</html>

Answer 11

您在添加步骤期间缺少类型转换...
var x = y + z;应为var x = parseInt(y) + parseInt(z);

 <!DOCTYPE html>

 <html>
 <body>
  <p>Click the button to calculate x.</p>
  <button onclick="myFunction()">Try it</button>
  <br/>
  <br/>Enter first number:
  <input type="text" id="txt1" name="text1">Enter second number:
  <input type="text" id="txt2" name="text2">
  <p id="demo"></p>
 <script>
    function myFunction() 
    {
      var y = document.getElementById("txt1").value;
      var z = document.getElementById("txt2").value;
      var x = parseInt(y) + parseInt(z);
      document.getElementById("demo").innerHTML = x;
    }
 </script>
 </body>
 </html>

Answer 12

        <head>
<script type="text/javascript">
function addition()
{
var a = parseInt(form.input1.value);
var b = parseInt(form.input2.value);
var c = a+b
document.write(c);
}
</script>
</head>
<body>
<form name="form" method="GET">
<input type="text" name="input1" value=20><br>
<input type="text" name="input2" value=10><br>
<input type="button" value="ADD" onclick="addition()">
</form>
</body>
</html>

Answer 13

嘿朋友很简单

<html>
<body>
<p>Click the button to calculate x.</p>
<button onclick="myFunction()">Try it</button>
<br/>
<br/>Enter first number:
<input type="text" id="txt1" name="text1">Enter second number:
<input type="text" id="txt2" name="text2">
<p id="demo"></p>
<script>
  function myFunction() {
    var y = document.getElementById("txt1").value;
    var z = document.getElementById("txt2").value;
    var x = +y + +z;
    document.getElementById("demo").innerHTML = x;
  }
</script>

Answer 14

如果我们有两个输入字段，那么从输入字段中获取值，然后使用javascript添加它们。

$('input[name="yourname"]').keyup(function(event) {
    /* Act on the event */ 
    var value1 = $(this).val();     
    var value2 = $('input[name="secondName"]').val();
    var roundofa = +value2+ +value1;

    $('input[name="total"]').val(addition);             
});

Answer 15

$scope.focusFunctionZipV = function(Id){
    var div = '#' + Id;
    $(div).prop('tabindex', '1');
    $(div).select2('open');
    //zipV is a div having zip code with select2
    if(div == '#zipV'){
        $('.datepicker-simple').prop('tabindex', '0');  
    }
}

Answer 16

或者您可以简单地初始化

var x = 0; （您应该使用let x = 0;）

这样，它将添加不连接。

Answer 17

您可以使用正则表达式预先检查它们是否为数字

function myFunction() {
    var y = document.getElementById("txt1").value;
    var z = document.getElementById("txt2").value;
    if((x.search(/[^0-9]/g) != -1)&&(y.search(/[^0-9]/g) != -1))
      var x = Number(y)+ Number(z);
    else
      alert("invalid values....");
    document.getElementById("demo").innerHTML = x;
  }

Answer 18

通过解析函数中的变量来实现代码。

    <html>
      <body>
        <p>Click the button to calculate x.</p>
        <button onclick="myFunction()">Try it</button>
        <br/>
        <br/>Enter first number:
        <input type="text" id="txt1" name="text1">
        <br>Enter second number:
        <input type="text" id="txt2" name="text2">
        <p id="demo"></p>
        <script>
          function myFunction() {
            var y = parseInt(document.getElementById("txt1").value);
            var z = parseInt(document.getElementById("txt2").value);
            var x = y + z;
            document.getElementById("demo").innerHTML = x;
          }
        </script>
      </body>
    </html>

<强> 答案

Answer 19

使用parseFloat它会将字符串转换为包括小数值的数字。

 function myFunction() {
      var y = document.getElementById("txt1").value;
      var z = document.getElementById("txt2").value;
      var x = parseFloat(y) + parseFloat(z);
      document.getElementById("demo").innerHTML = x;
    }

<p>
  Click the button to calculate x.
  <button onclick="myFunction()">Try it</button>
</p>
<p>
  Enter first number:
  <input type="text" id="txt1" name="text1" value="1">
  Enter second number:
  <input type="text" id="txt2" name="text2" value="2">
</p>
<p id="demo"></p>

Answer 20

您还可以写： var z = x - -y; 你得到了正确答案。

<body>

<input type="text" id="number1" name="">
<input type="text" id="number2" name="">
<button type="button" onclick="myFunction()">Submit</button>

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

    <script>
    function myFunction() {
        var x, y ;

        x = document.getElementById('number1').value;
        y = document.getElementById('number2').value;

        var z = x - -y ;

        document.getElementById('demo').innerHTML = z;
    }
    </script>
</body>

Answer 21

如果没有任何效果，请仅尝试此操作。这样做可能不是正确的方法，但是当以上所有方法均失败时，它对我有用。

 var1 - (- var2)

Answer 22

这也可以通过使用output元素使用更原生的HTML解决方案来实现。

<form oninput="result.value=parseInt(a.valueAsNumber)+parseInt(b.valueAsNumber)">
  <input type="number" id="a" name="a" value="10" /> +
  <input type="number" id="b" name="b" value="50" /> =
  <output name="result" for="a b">60</output>
</form>

https://jsfiddle.net/gxu1rtqL/

output元素可以用作容器元素，用于计算或输出用户的动作。您还可以将HTML类型从number更改为range，并使用不同的UI元素保留相同的代码和功能，如下所示。

<form oninput="result.value=parseInt(a.valueAsNumber)+parseInt(b.valueAsNumber)">
  <input type="range" id="a" name="a" value="10" /> +
  <input type="number" id="b" name="b" value="50" /> =
  <output name="result" for="a b">60</output>
</form>

https://jsfiddle.net/gxu1rtqL/2/

Answer 23

另一种解决方案，只是分享:)：

var result=eval(num1)+eval(num2);

Answer 24

也许你可以用这个函数来添加数字：

function calculate(a, b) {
  return a + b
}
console.log(calculate(5, 6))

添加两个数字会连接它们而不是计算总和

24 个答案: