计算使用AJAX生成的输入类型的总和

Question

我有这些具有相同ID，名称的输入字段。 这些输入是根据用户选择使用ajax代码生成的。 我想使用jquery在total_amount字段中完成这些输入字段的总和（p_amount）。

<input type="text" id="p_amount" name="p_amount[]" placeholder="Enter Amount ">
<input type="text" id="p_amount" name="p_amount[]" placeholder="Enter Amount ">

<input type="text" id="p_amount" name="p_amount[]" placeholder="Enter Amount ">
<input type="text" id="p_amount" name="p_amount[]" placeholder="Enter Amount ">
<input type="text" id="p_amount" name="p_amount[]" placeholder="Enter Amount ">

<input type="text" id="total_amount" name="total_amount"  value="" placeholder="Total Amount">

我正在使用以下js代码，但它仅返回在第一个文本字段中输入的数字总和。 我想要所有ID与p_amount的总和。 请在这里帮助我。

<script type="text/javascript">
$('#total_amount').click(function() {
    var p_amount=$("#p_amount").val();
    var total = 0;
    for (var i = 0; i < p_amount.length; i++) {
        total += p_amount[i] << 0;
    }
</script>

Answer 1

问题在于您使用的字段的id必须不同。 您应该使用class属性来注释多个元素。

然后，您可以使用JQuery来获取它们，并使用.each（）对其进行遍历。

您可以在此处找到更多信息和示例： JQuery .each（）

Answer 2

尝试这个，

var total=0;
$('#total_amount').click(function() {
    $("input[name='p_amount[]'").each(function(){
        total+=parseInt($(this).val());
    });
});
alert(total);