javascript - jQueryで数学を行う

Question

var num1 = $("input[id='weight']").val(),
    num2 = $("input[id='height']").val(),
    result = num1 / (num2*num2);

$("#submit").click(function() {
    $(".result").text(result);
});

NaN結果がどこにあるべきかを表示しているだけです。なんで？

Answer 1

ページの読み込み時ではなく、クリック イベント内で値を取得する必要があります。

$("#submit").click(function() {
  var num1 = $("input[id='weight']").val(),
    num2 = $("input[id='height']").val(),
    result = num1 / (num2*num2);
  $(".result").text(result);
});

NaN結果として生じる可能性がある他のいくつかの理由もあります。

• 高さフィールドはゼロに評価されます。（ただし、通常はInfinityではなく結果が得られNaNます。）

• 一部のフィールドには、数値に変換できないものが含まれています。

• コードで間違った名前を使用したため、実際にはフィールドから値を取得できません。

• 0.5たとえば、ブラウザが を期待している0,5場合や、その逆の場合など、間違った小数点記号で浮動小数点数を使用しています。

いくつかのメモ:

• parseInt計算を行う前に、またはparseFloat(いずれか適切な方) を使用して文字列を解析することをお勧めします。

• input#weightまたはのようなセレクターを使用するかどうかを検討してください#weight。input[id='weight']ページ内に同じ ID を持つ複数の要素がある場合のように、セレクターを使用するだけで済みますが、これはお勧めできません。

Answer 2

$(function(){
    $("#submit").click(function() {
        var num1   = $("#weight").val(), 
            num2   = $("#height").val(), 
            result = num1 / (num2 * num2);
        $(".result").text(result);
    }); 
});

少し説明：

問題は、ここでparseIntを実行しないことです。私見の問題は、数学の時点で2つの変数が空であるか、数値ではないことです...

Answer 3

それらを整数に変換します（整数を使用していると仮定します）：

var num1 = parseInt($("#weight").val(), 10),
    num2 = parseInt($("#height").val(), 10),
    result = num1 / (num2*num2);

Answer 4

これを試して

var num1 = parseInt($("input[id='weight']").val());
num2 = parseInt($("input[id='height']").val());
result = num1 / (num2*num2);

$("#submit").click(function() {
$(".result").text(result);
});