Question

我有一个表单，您可以添加更多输入字段。所有人都有同一个班级。每当输入字段改变时，我计算所有那些输入字段的总和。

适用于所有现有领域。一旦我尝试使用新添加的字段，它就不再起作用了。

我以为我可能不得不使用“直播”活动。但无法弄清楚如何。

这是我的代码：

$('.price_item').change(function() {
   var ntotal = 0;
   $('.price_item').each(function() {
      ntotal += parseFloat($(this).val());
   });
});

我该怎么办？

Answer 1

您必须将事件处理程序放在文档上，因为您需要它来处理尚不存在的元素。

$(document).on('change', '.price_item', function() {
    var ntotal = 0;
    $('.price_item').each(function(){
        ntotal += parseFloat($(this).val());
    });
});

添加JSFiddle：JSFiddle

Answer 2

使用on()之类的，

$(document).on('change', '.price_item', function() {
    var ntotal = 0;
    $('.price_item').each(function(){
        ntotal += parseFloat($(this).val());
    });
});

Answer 3

http://api.jquery.com/on/应该可以满足您的需求：

$(document).on('change', '.price_item', handlePriceItemChange);
function handlePriceItemChange(){
  var ntotal = 0;
   $('.price_item').each(function(){
      ntotal += parseFloat($(this).val());
   });
}

Answer 4

从jQuery 1.9开始，你不能使用.live（），所以你应该使用.on（）。

尝试这样的事情：

jQuery(function($){
$(document).on('change', 'input', function(){

    var ntotal = 0;
    $('.price_item').each(function(){
        ntotal += parseFloat($(this).val());
    });

    console.log('sum: ' + ntotal);

    //adds new input for testing
    $(this).after('<input type="text" class="price_item" />');
});               
});

jQuery - 计算输入字段的总和，包括稍后添加的字段

4 个答案: