Javascript 使用jQuery获取所有输入值的总和

我需要输入的所有值的总和。结果必须显示在输入字段total中，该字段为

只读

用户可以输入1个或多个值。问题是我的

var

值不正确。我还想知道如何通过

onchange

立即返回值

$(document).ready(function() {
  $("div#example input").change(function() {
    var value = '';    
    $("div#example input[name!=total]").each(function() {
      value += $(this).val();      
    });
    console.log("value after each: " + value);
  });
})

HTML:

使用+=parseInt（$（this.val（））

---

：]

试试这样的方法：

$(document).ready(function() {
    $("div#example id^='value'").change(function() {
        var value = 0;

        $("div#example input[name!=total]").each(function() {
            var i = parseInt($(this).val());

            if (!isNaN(i))
            {
                value += i;
            }
        });

        $('#total').val(value);
    });
})

---

我认为这可能更接近：

<script type="text/javascript">

$(document).ready(function() {

  $("#example value").change(function() {
    var total = 0;    
    $("#example value").each(function() {
      total += parseInt($(this).val());      
    });
    window.console && console.log("value after each: " + total);
  });
})

</script> 

<div id="example">
   <input type="text" size="5" class="value" name="value1" />
   <input type="text" size="5" class="value" name="value2" />
   <input type="text" size="5" class="value" name="value3" />
   <input type="text" size="5" class="value" name="value4" />
   <input type="text" size="5" class="value" name="value5" />
   <input type="text" size="5" id="total" readonly="readonly" class="bckground" name="total" />
</div>

$（文档）.ready（函数（）{
$（“#示例值”）.change（函数（）{
var合计=0；
$（“#示例值”）。每个（函数（）{
total+=parseInt（$（this.val（））；
});
window.console&&console.log（“每次之后的值：+total”）；
});
})

您最初的$.change（）选择器包含了total框，我怀疑您不需要它

我猜你想加数字对吗？原始的“value”变量是一个字符串

顺便说一句，使用“window.console&&console.log”习惯用法更安全，因为对于许多用户来说没有控制台变量。（尽管我打赌那行代码只是为了调试。）

编辑

---

根据其他建议添加了parseInt（）。

使用jQuery表单序列化：

alert($("form_id").serialize());

---

还有一个不同序列化类型的比较：

以及如何返回值？NB-在空输入上失败，因此需要使用isNan（）检查该值（以及其他虚假输入）-有关详细信息，请参阅我的答案“可疑”-但您不确定；-）我想知道当使用val（）函数以编程方式更改值时，change（）是否会触发。对于我来说，如果不将val（）的结果转换为一个数值，这将执行字符串连接，这不是必需的。Bobby我正在尝试遵循这一点，你能为实现添加一些上下文吗？每次更新输入字段时（不点击提交）都会运行此功能吗？@square_eyes:是的，传递给change（）的函数将在这些输入发生任何更改时执行，但请记住，javascript将文本输入的“更改”解释为“使用新值失去焦点”-即键入数字后，再移出输入字段，更改事件将触发。

<script type="text/javascript">

$(document).ready(function() {

  $("#example value").change(function() {
    var total = 0;    
    $("#example value").each(function() {
      total += parseInt($(this).val());      
    });
    window.console && console.log("value after each: " + total);
  });
})

</script> 

<div id="example">
   <input type="text" size="5" class="value" name="value1" />
   <input type="text" size="5" class="value" name="value2" />
   <input type="text" size="5" class="value" name="value3" />
   <input type="text" size="5" class="value" name="value4" />
   <input type="text" size="5" class="value" name="value5" />
   <input type="text" size="5" id="total" readonly="readonly" class="bckground" name="total" />
</div>

alert($("form_id").serialize());