Jquery 如何从多个可选输入更新总和？

我有一个比较大的表格，它有货币价值，最后有一个总和。我正在尝试使用javascript（jQuery）自动更新总数。有些输入字段是可选的。我正在考虑使用.change（）方法。有没有比将更改方法与每个输入字段关联更好的方法

脚本只需要从输入字段（如果有）中获取值，将它们相加并在某处显示总数。我的想法是标记每个相关的输入字段并选择它们。这可能吗

[编辑] 示例代码：

<input name="input1" type"text" />
<input name="input2" type"text" />
<input name="input3" type"text" />
<input name="input4" type"text" />
<input name="input5" type"text" />
<input name="input6" type"text" />

<input name="total" type="text" />

---

所有输入最初都为空。我想在输入值时更新总数

我想那会管用的。将更改事件附加到类。我认为最简单的方法是循环更改回调中的集合，并汇总所有值。如果需要，您可能只需要使用当前更改项的值，但出于某种原因，我觉得重新计算可能更安全

$(".money").change(function(){
     var total = 0;
     $(".money").each(function(){
         total += $(this).val();
     }
     //now you can use total
});

---

我想那会管用的。将更改事件附加到类。我认为最简单的方法是循环更改回调中的集合，并汇总所有值。如果需要，您可能只需要使用当前更改项的值，但出于某种原因，我觉得重新计算可能更安全

$(".money").change(function(){
     var total = 0;
     $(".money").each(function(){
         total += $(this).val();
     }
     //now you can use total
});

如果您将一个类（称之为“foo”）添加到每个要合计的输入元素中，那么这将起作用：

var $form = $('#my-form-id'),
    $summands = $form.find('.foo'),
    $sumDisplay = $('some-other-selector');

$form.delegate('.foo', 'change', function ()
{
    var sum = 0;
    $summands.each(function ()
    {
        var value = Number($(this).val());
        if (!isNaN(value)) sum += value;
    });

    $sumDisplay.text(sum);
});

演示：

如果向每个要合计的输入元素添加一个类（称之为“foo”），那么这将起作用：

var $form = $('#my-form-id'),
    $summands = $form.find('.foo'),
    $sumDisplay = $('some-other-selector');

$form.delegate('.foo', 'change', function ()
{
    var sum = 0;
    $summands.each(function ()
    {
        var value = Number($(this).val());
        if (!isNaN(value)) sum += value;
    });

    $sumDisplay.text(sum);
});

---

演示：

除了在将数字添加到总数之前需要分析和验证数字外，此功能也有效。除了在将数字添加到总数之前需要分析和验证数字外，此功能也有效。由于

delegate

已被弃用，您可能需要改为使用

on

。如果您这样做，请务必切换

'.foo'

和

'change'

@Pixelsmith谢谢您的提示。您是否介意建议编辑以将我的答案更新为最新的推荐代码？谢谢由于不推荐使用

delegate

，因此您可能希望在上使用

。如果您这样做，请务必切换
'.foo'
和
'change'
@Pixelsmith谢谢您的提示。您是否介意建议编辑以将我的答案更新为最新的推荐代码？谢谢