1. ホーム
  2. ジャバスクリプト

[解決済み】2つの数値の足し算は、和を計算する代わりに連結する

2022-04-06 16:23:44

質問

2つの数字を足しているのですが、正しい値が出ません。

例えば 1 + 2 は3ではなく12を返す

このコードのどこが間違っているのでしょうか?

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>

解決方法は?

実は数字ではなく文字列なのです。文字列から数字を生成する最も簡単な方法は、文字列の前に + :

var x = +y + +z;