jQuery .click（）：同じクラスのDIVから属性を取得

Question

clickイベントに問題があります。ここでのコードは次のとおりです。

jQueryの：私はいつもDIV、アラートの印刷をクリックして、同じクラスで

<div class="myClass" iditem="1"> 
    1 
</div> 
<div class="myClass" iditem="2"> 
    2 
</div> 

二DIVが、同じ属性の異なる値、：

$(document).ready(function() { 
    $('.myClass').click(function() { 
     alert($(.myClass).attr("iditem")); 
    }); 
}); 

HTML "1"（それは2番目の宣言を無視しているようですDIV）。なぜ.attr()が2番目のDIVに適切な値を取らないのですか？

Answer 1

あなたは$('.myClass').attr("iditem")を持っていると仮定するとdocumentation ^{[docs] þ}で説明したように、これは常に、セットで最初要素の属性を返します。

の属性の値を取得します。一致した要素のセットの最初の要素

だからではなく、クラスmyClassとすべての要素を選択する（つまり、$('.myClass')が何をするか、それが呼び出された場所/無問題です）、あなたは、クリックされた要素への参照を取得したいです。単純に実行します。

$(this).attr('iditem'); 

thisは常にイベントハンドラがバインドされた要素を指します。

<div class="myClass" data-item="1"> 

あなたはその後、値を取得するために.data()^[docs]を使用することができます。

は、私は、少なくとも有効なHTML5を持つように、カスタム属性の代わりにHTML5 data-* attributesを使用することをお勧めします。

---

þ：本当にjQueryのドキュメントを読むべきです。多くの例と各メソッドの動作の詳細な説明を提供します。 selectors ^[docs]の仕組みについても理解してください。

Answer 2

alert($(".myClass").attr("iditem"));

Answer 3

あなたがクリックしたアイテムのitemidを表示するとしますか？その後、この作品：

$('.myClass').click(function() { 
    alert($(this).attr("iditem")); 
}) 

Answer 4

$(".myClass")戻っクラスmyClassを持つすべての要素を。私はあなたの代わりにこのようなものが欲しいと思います：

$(document).ready(function() 
    { 
     $('.myClass').click(function() { 
      alert($(this).attr("iditem")); 
     }); 
    });