jQuery添加了多个文本框值

Question

我有一项新任务要做，我不确定使用jQuery处理它的最佳方法。

基本上，客户需要'x'个文本框（数量），每个文本框都有一个加/减按钮/图标，当你点击每个文本框时，所有相关字段都会更新。

e.g。 （如果页面中有3个选项）

数量[0] + -
数量[0] + -
数量[0] + -

以上所有[0]

的总和

我经常使用jQuery，但我不确定从这个开始。

非常感谢任何建议。

阿迪。

Answer 1

如果您将CSS类添加到需要求和的所有输入字段，则可以将更改事件处理程序附加到它们所有负责更新总计的字段：

$('input.qty').change(function() {       
    // Loop through all input's and re-calculate the total
    var total = 0;
    $('input.qty').each(function(){
        total += parseInt(this.value);
    });

    // Update the total
    $('#total').val(total);
);

你可以看到它in action here。

备注

1. 我遗漏了+和 - 按钮。这些可能只是根据需要递增/递减其相关输入值的链接。
2. 更新总计使用parseInt从字符串转换为int。你应该确保输入的值是一个有效的整数。