21

私が次のようなhtml構造を持っている場合：

<div id="parent">
 <div class="child first">
   <div class="sub-child"></div>
 </div>

 <div class="child second">
   <div class="sub-child"></div>
 </div>

 <div class="child third">
   <div class="sub-child"></div>
 </div>
</div>

クリックハンドラーを定義してから、クラスが（デモを明確にするためにクラスが追加されただけです）($('#parent.child')).click()のdivをクリックします。2番目の子であるため、番号1を取得する簡単な方法はありますか？（0ベースのインデックス）？secondfirst, second, third

何かのようなもの$(this).index

4

2 に答える 2

33

jQuery API を見てみましょう。あなたが提案する方法は、indexまさに正しいです：

$('#parent .child').click(function() {
    var index = $(this).index();
});

ドキュメントから：

引数が .index() メソッドに渡されない場合、戻り値は、兄弟要素に対する jQuery オブジェクト内の最初の要素の位置を示す整数です。

また、セレクターを例から少し変更したことにも注意してください。私はそれがあなたの質問のタイプミスだったと推測しています。#parent.childIDが「親」でクラスが「子」の要素を探しますが、実際には#parent .child（スペースに注意してください）IDが「親」の要素の子孫であるクラスが「子」の要素を見つけたいとします。

于 2012-05-05T10:20:16.560 に答える
8

このindex()メソッドは、コレクション内の要素の位置を取得するために使用できます。基本的な状況では、$(this).index()動作するはずです。

しかし、より具体的なコレクションを使用すると、で位置を取得できますcollection.index(item)。#parent測定時に数えるべきではない単純なものをあなたに追加することを想像してみてくださいindex()（span、、、img何か）。単純な方法では、コードが破損する可能性がありますが、特定の方法では破損しません。

このようなものがあなたのために働くはずです：

var $children = $('#parent .child').click(function​ () {
    console.log($children.index(this));
});​

jsFiddleデモ

于 2012-05-05T10:21:28.590 に答える