javascript - 使用 jQuery 迭代附加项目

Question

问题

我有一个使用 jQuery 来实现魔法的表单。该表单上有一个按钮添加帐户。该按钮附加字段 Account 和 Amount 以及另一个按钮 Remove Account(如果您能猜到，则会删除这两个字段)。这一切都很好...

在同一张表单上还有另一个字段Salary，我想将其与所有Amount字段的总和进行比较。问题是，当我使用 jQuery 的 $.each() 迭代 Amount 字段时，它仅识别页面加载时 DOM 中存在的那些字段，而不识别新添加的字段。

如何迭代这些附加的 Amount 字段？ (或者也许有更好的方法来做到这一点？)

我现在在做什么:

$(document).ready(function(){
  $('#form').on('keyup', '.amount', balanceAmountsWithSalary);
});

var balanceAmountsWithSalary = function(){
  var salary = parseInt($('#salary').val(),10);
  var total = 0;
  $('#accounts .account').each(function(){
    var amount = parseInt($(this).find('.amount').val(),10);
    total += amount;
  });
  if (total === salary) {
    $('#accounts .account').each(function(){
      // Do some stuff to each input.amount located in div.account
    });
  } else {
    $('#accounts .account').each(function(){
      // Do some BAD stuff to each input.amount located in div.account
    });
  }
}

谢谢!

<小时/>

回答

因此，一开始就包含我的其余代码可能会更有帮助，因为问题是添加帐户事件中的一个简单错误。我错误地标记了我的容器类，仅在附加项目的名称中添加了“s”。无论如何，这就是评论!在 jsFiddle 上发布一个示例帮助我找到了这个错误，所以 here is the thing in action如果您想知道的话。

Answer 1

由于没有提供HTML代码和动态添加输入的代码，我编辑了一个现有的Fiddler来获取动态添加输入字段的总数。

在此 fiddler 中，使用简单的 for 循环来计算总金额。

Here is a fiddler which might help you.

//button click get total
$('#GetTotal').click( function(event){
        var tableID = "NewInvoiceTable";
        GetTotalAmount(tableID);
        return false;
    });
//Get total
function GetTotalAmount(tableID)
{
    var i = $('#' + tableID + ' tr').length;
    alert("Total Rows -" + i);
    var TotAmt = 0;
    for(j=0;j<i;j++)
    {
        TotAmt += parseInt($('#TotalInline-' + j).val());
    }
    alert("Total Amount - " + TotAmt);
}