keyup以上の入力フォーム

Question

最初の入力フォームは常に機能しますが、2番目、3番目、4番目などは決して行いません。私は間違って何をしていますか？

のjQuery

$('#cartUpdate').keyup(function() { 

    var url = $(this).attr('action'); 
    var qty = $('input[name=qty]').val(); 
    var rowid = $('input[name=rowid]').val(); 

    if(qty > 0) { 
     $.post(url, {qty: qty, rowid: rowid }, function(changeCost) {  

     }); 
    } 

    return false; 
}); 

HTML：

<form action="cart/update" id='cartUpdate' method="post" accept-charset="utf-8">  
    <input type="hidden" name="rowid" value="76ea881ebe188f1a7e7451a9d7f17ada" /> 
    <input type="text" name="qty" value="5" />  
</form> 
<form action="cart/update" id='cartUpdate' method="post" accept-charset="utf-8">  
    <input type="hidden" name="rowid" value="e7a36fadf2410205f0768da1b61156d9" /> 
    <input type="text" name="qty" value="1" /> 
</form> 

Answer 1

両方のフォームで同じIDを使用しており、最初の要素のみを返します。あなたのフォームでクラスie = class = "cartUpdate"と関数内の$（ '。cartUpdate'）を使うか、フォームにid = "cartUpdate1"、id = "cartUpdate2"を使うこともできます。 cartUpdate1、＃cartUpdate2 '）。keyup（...）;

注：一致する要素のグループの固有の要素とクラスにidを使用します。

var qty = $('input[name=qty]', $(this)).val(); 
var rowid = $('input[name=rowid]', $(this)).val(); 

これは動作するはずです。

Answer 2

あなたは、両方の形式に同じIDを持っています。

Answer 3

同じIDを持つ要素を複数持つことはできません。 $('#cartUpdate')は、1つの要素（最初の要素）のみを返すネイティブdocument.getElementByIdを使用します。

代わりに両方のフォームにクラスを割り当てて使用します。