jquery - jquery nth-selecting と setInterval

Question

こんにちは。基本的に、毎秒jqueryを使用して次の画像をクリックしたい：

jQuery:

 var i=1;

 setInterval(function() {
  $(".portfolio :nth-child("+i+")").click();
  if (i<5) {i++;} else {i=1;}

 }, 1000);

HTML:

<div class="portfolio"> 
  <ul> 
   <li><img src="images/4.jpg" alt="4" id="promo_one"></li> 
   <li><img src="images/1.jpg" alt="1" id="promo_two"></li> 
   <li><img src="images/2.jpg" alt="2" id="promo_three"></li> 
   <li><img src="images/3.jpg" alt="3" id="promo_four"></li> 
  </ul> 
 </div>

前もって感謝します：）

score 1 · Accepted Answer

あなたのセレクターは次のようになるべきだと思います：

$(".portfolio > ul > li:nth-child("+i+")").click();

...たとえば、 a の子であるa の子であるn 番目 を探しています。それらは子セレクターです。おそらく代わりに子孫セレクターを使用できますが、子セレクターは検索が少ないため、もう少し効率的であると思います (推測)。(もちろん、構造を変更すると、もろくなります。)liul.portfolio

あなたの比較についてのパトリックのポイントも参照してくださいi<4。おそらく1つずれています。

score 1 · Accepted Answer

リンクが 4 つあるので、iより小さいかどうかを確認したいと思います。4

if (i<4) {i++;} else {i=1;}

:nth-childは1ベースインデックスであり、4より小さいため、5に到達する4とにインクリメントされますが5、はありません:nth-child(5)。

:nth-child他の人が指摘したように、正しい要素にもを指定する必要があります。

例: http://jsfiddle.net/JBt6b/

score 1 · Accepted Answer

代わりに、次のようにここで:nth-child()使用できます。.eq()

var i=1;
setInterval(function() {
  $(".portfolio ul li img").eq(i).click();
  i = i==3 ? 0 : i + 1;
}, 1000);

セレクターも下に移動する必要があります<img>(または、imgをクリックしたい場合はその部分を除外します<li>)。そうしないと、他の要素もクリックします。これにより、すべての画像が取得され、使用したいインデックスの画像が取得され.eq(index)ます.click()。

score 0 · Accepted Answer

var i=1;

setInterval(function(){
   $('.portfolio').find('img[alt=' + i + ']').trigger('click');
   if(i < 4) i++; else i=1;
}, 1000);

ALT 属性を調べると、このタスクのパフォーマンスが向上します (多くのように)。もちろん、ALT 属性が常に存在する場合にのみ意味があります。

score 0 · Accepted Answer

次のように JavaScript コードを変更します。

var i=1;

setInterval(function() {
  $(".portfolio ul :nth-child("+i+")").click();

  if (i<5) {i++;} else {i=1;}

}, 1000);

あなたの例.portfolioでは n 個の子がなく、1 個あります。

score 0 · Accepted Answer

私はあなたが近いと思います（何が機能していないのか正確にはわかりません）が、セレクターを次のように変更することをお勧めします。

".portfolio :nth-child("+i+")"

に：

".portfolio ul li:nth-child("+i+")"

n 番目の li 要素を選択しようとしている場合。コードに他に何が問題があるのかわかりません。これで問題が解決しない場合は、質問を拡大してください。

score 0 · Accepted Answer

多くのアイテムを事前に計算し、剰余演算を使用して画像を回転させます。

var images = $('.portfolio img').;
var count = images.length;
var lastClicked = count - 1;

setInterval( function() {
    var next = ++lastClicked % count;
    images.eq(next).click();
}, 1000);

jquery - jquery nth-selecting と setInterval

7 に答える 7

Related

Reference