jqueryで次のインデックス値を取得する方法

Question

各ループで次のインデックス値を取得したい場合は、インデックスが最後（ここでは2）の場合は、最初のインデックス値を取得します。

私は次のコードを試しましたが、動作しませんでした。

keyword = 'on'; 
var nextitem = ''; 
$(".clsiteration").each(function(index, el) { 
    if ($(this).attr("src").toLowerCase().indexOf(keyword.toLowerCase()) > 0) { 
     if (index == 2) 
      nextitem = $(this).first().attr('data-val'); 
     else 
      nextitem = $(this).next().attr('data-val'); 
    } 
}); 

HTML

<div> 
     <img src="img_off.jpg" class="clsiteration" data-val="k1" > 
     <img src="img_on.jpg" class="clsiteration" data-val="k2" > 
     <img src="img_off.jpg" class="clsiteration" data-val="k3" > 
</div> 

にはどうすれば次のインデックス値を得ることができますか？ありがとう

Answer 1

Snippetを見てくださいJQUERYでどのようにnext()が動作します。

$(function(){ 
 
keyword = 'k1'; 
 
var nextitem = ''; 
 
$(".clsiteration").each(function(index, el) { 
 
     if (index === 2){ 
 
      nextitem = $(this).closest("div").find("img:eq(0)").data('val'); 
 
      } 
 
     else { 
 
      nextitem = $(this).next().data('val'); 
 
      } 
 
    console.log(nextitem); 
 
}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div> 
 
     <img src="img_off.jpg" class="clsiteration" data-val="k1" > 
 
     <img src="img_on.jpg" class="clsiteration" data-val="k2" > 
 
     <img src="img_off.jpg" class="clsiteration" data-val="k3" > 
 
</div>