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，反之亦然。

一些注意事项：

• 在进行计算之前，最好使用parseIntor （任何合适的）解析字符串。parseFloat

• 考虑使用类似的选择器input#weight是否#weight可行。如果页面中有多个具有相同 id 的元素，则只需要使用选择器input[id='weight']，不建议这样做。

Answer 2

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

小解释：

问题不在于 parseInt 在这里。恕我直言，问题是在数学的那一刻，两个变量是空的或者不是数字......

Answer 3

尝试这个

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

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

Answer 4

将它们转换为整数（假设您使用的是整数）：

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