1. ホーム
  2. javascript

[解決済み] jQueryで入力フィールドから2つの数値を追加する

2022-02-11 09:10:32

質問

アラートボックスの値を2つ追加しようとしているのですが、空白のアラートボックスが表示され続けます。 なぜでしょうか?

$(document).ready(function(){
    var a = $("#a").val();
    var b = $("#b").val();   
    $("submit").on("click", function(){
        var sum = a + b;
        alert(sum);         
    })
})

解決方法は?

文字列を追加すると、文字列が連結されます。

> "1" + "1"
"11"

まず数字にパースする必要があります。

/* parseFloat is used here. 
 * Because of it's not known that 
 * whether the number has fractional places.
 */

var a = parseFloat($('#a').val()),
    b = parseFloat($('#b').val());

また、クリックハンドラの内部から値を取得する必要があります。

$("submit").on("click", function() {
   var a = parseInt($('#a').val(), 10),
       b = parseInt($('#b').val(), 10);
});

そうでなければ、ページが読み込まれたときのテキストボックスの値を使うことになります。