1

私はこのマークアップを持っています

<a class="foo"></a>
<div>
  <span class="foo"></span>
  <ul>
    <li class="foo"></li>
  </ul>
  <em class="foo"></em>
</div>
<div class="foo"></div>

にクリック ハンドラを追加します.foo。同じクラスを持つ DOM ツリーの次の要素をフェッチしたい。

何かを試してみたい場合は、マークアップと js コードを使用してjsFiddleを作成しました。

すべての .foo 要素の配列を作成し、ループを実行して現在のインデックスを見つけ、次のインデックスを返すこともできますが、もっと良い解決策があるはずです。また、要素をページに動的に追加すると、その解決策は機能しません(私はそうします)。

これをどのように進める必要がありますか？

4

2 に答える 2

3

これにより、次の .foo 要素が取得されます。

var foos = $('.foo');
$(".foo").click(function() {
    if($(foos).index(this) + 1 != foos.length)console.log(foos[$(foos).index(this) + 1]);
});​

jsFiddle の例

Dogbert の正確なニーズに合わせて更新されたコード例:

$(".foo").click(function() {
    var text = "Clicked on a: ";
    text += $(this)[0].tagName;
    text += "; Next is a: ";
    var foos = $(".foo");
    var probably = foos[foos.index(this) + 1];
    if(probably)
        text += probably.tagName;
    else
        text += "Nothing!";
    text += "<br/>";
    $("body").append(text);
});

</p>

于 2012-08-11T20:36:41.583 に答える
0

j08691 の方が速かったです。とにかく、これは私が思いついたものです:

http://jsfiddle.net/tXxng/9/

基本的に、それは何をするのとほぼ同じ.index()です。すべての項目を反復し、1 つの一致の後に最初の項目を返すか、一致が最後の項目である場合は配列の最初の項目を返します (必要でない場合は、この循環動作を無効にすることができます)。

于 2012-08-11T20:49:17.233 に答える