使用jquery計算N個輸入的值

Question

我有一個表單，用戶可以創建無限數量的行（使用jquery-添加新行）來添加多個產品信息。當他們創建新行時，代碼如下所示。

現在，當每次用戶提出的產品質量和產品的價格，我想立即計算出總(product quantity* product price)並把結果在total[]輸入，然後調整total amount輸入是值什麼，我試圖做的是在表單的底部。

我知道如何做到這一點，當我有固定數量的輸入使用jQuery，但由於輸入量不固定在這種情況下，我有任何想法如何實現這一點。

你能告訴我嗎？

感謝提前:)

<tr> 

    <td><input type="text" name="name[]" id="name_1" value=""></td> 
    <td><input type="text" name="quantity[]" id="quantity_1" value=""></td> 
    <td><input type="text" name="rate[]" id="rate_1" value=""></td> 
    <td><input type="text" name="total[]" id="total_1" value=""></td>       

</tr> 

<tr> 

    <td><input type="text" name="name[]" id="name_2" value=""></td> 
    <td><input type="text" name="quantity[]" id="quantity_2" value=""></td> 
    <td><input type="text" name="rate[]" id="rate_2" value=""></td> 
    <td><input type="text" name="total[]" id="total_2" value=""></td>      

</tr> 

    <!-- I have N number of rows like above. and at the bottom I have input for total --> 
<tr> 

    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td><input type="text" name="totalamount" id="totalamount" value=""></td>       

    </tr>       

Answer 1

這裏是一個可能的解決方案：

$(":text[name='quantity[]'], :text[name='rate[]']").on("change", function() { 
    var totalamount = 0; 
    $("tr").each(function() { 
     var quantity = +$(this).find(":text[name='quantity[]']").val() || 0; 
     var rate = +$(this).find(":text[name='rate[]']").val() || 0; 
     var subtotal = quantity * rate; 
     $(this).find(":text[name='total[]']").val(subtotal); 
     totalamount += subtotal; 
    }); 
    $("#totalamount").val(totalamount); 
});​ 

DEMO：http://jsfiddle.net/ak49E/