同じクラスの次の要素を取得する

Question

特定のクラスの要素に対してclickイベントを使用します。 clickイベント関数の中で、私は同じクラスでページ上の次の要素を取得する必要があります。私が試した：

$('.class').click(function() { 
    var $next = $(this).next('.class') 
}); 

そして：

$('.class').click(function() { 
    var $next = $(this).parent().parent().parent().next('.class') 
}); 

の.classは、テーブル内のTDの内側のdivであるが、だからこそ、三回の親（）。

私のHTMLは、このような何か（.classファイルが.dragである）である。これについて

<table cellspacing="0" cellpadding="0" border="0" class="black8"> 
<tr class="trow1 drop trow1_over" 
    rel="0,1"> 
    <td> 
      <div class="drop rootFolder" 
       rel="0,1"></div> 
    </td> 
    <td width="100%" 
     class="folderListOnclick"> 

      <span>.. (koreňový adresár)</span> 
    </td> 
    <td> 
    </td> 
    <td> 
    </td> 
</tr><tr class="trow1"> 
    <td> 
     <div class="drag drop ordinaryFolder" 
      rel="1,1" 
      style="width: 40px;"> 

     </div> 
    </td> 
    <td width="100%" 
     class="folderListOnclick" 
     rel="1"> 
      <span>aaa</span> 
    </td> 
    <td> 
     <div class="button_mini folderEditOnclick" 
      rel="1"> 
        <span></span> 

     </div> 
    </td> 
    <td> 
     <div class="button_mini folderDeleteOnclick" 
      rel="1"> 
        <span><span> 
     </div> 
    </td> 
</tr><tr class="trow1"> 
    <td> 

     <div class="drag drop ordinaryFolder" 
      rel="19,1" 
      style="width: 50px;"> 
     </div> 
    </td> 
    <td width="100%" 
     class="folderListOnclick" 
     rel="19"> 
      <span>subaaa</span> 
    </td> 
    <td> 
     <div class="button_mini folderEditOnclick" 
      rel="19"> 

        <span></span> 
     </div> 
    </td> 
    <td> 
     <div class="button_mini folderDeleteOnclick" 
      rel="19"> 
        <span><span> 
     </div> 
    </td> 
</tr> 
</table> 

Answer 1

お試しください：

$(".drag").click(function() { 
    var draggables = $(this).parents("table").find(".drag"); 
    var $next = draggables.filter(":gt(" + draggables.index(this) + ")").first(); 
}); 

Answer 2

どのように？私はそれをテストしていないので、オフに1つのエラーを確認する必要があります。

$('.class').click(function() { 
    var index = $('.class').index($(this)); 
    var $next = $('.class').slice(index+1,index+2); 
    ... 
}); 

あなたは slice()の組み合わせを使用することができます

Answer 3

、およびeach()：

var elements = $('.class'); 

elements.each(function(index, element) { 
    $(this).click(function() { 
     var $next = elements.slice(index+1, index+2); 
    }); 
}); 

また

DEMO

（多分あまり効率的ではないが）共通の祖先への参照を取得し、slice()を使用することですおよびindex()：

$('.class').click(function() { 
    var elements = $(this).closest('table').find('.class'); 
    var index = elements.index(this); 
    $next = elements.slice(index + 1, index + 2); 
});