jquery，循环遍历div，然后停在最后一个div？

Question

我一直在四处寻找，但还没有找到真正有效的东西。

基本上我们有一个用户单击按钮的插页式页面。我想循环浏览背景图像，例如每个 500 毫秒，然后停在最后一个 div 上。

我已经发现了一些东西，但在最后一个上找不到任何东西？我玩过的那些似乎并没有停止在最后一个，它只是继续运行。

提前致谢！

这是代码，基本上 Slide1 将显示 500 毫秒，Slide2 将显示 500 毫秒，然后停止在 SlideMain 上：

 <div id="slideshow">
        <div id="slide1" class="active">Slide1</div>
        <div id="slide2">Slide2</div>
        <div id="slide3">Slide3</div>
        <div id="slide4">Slide4</div>
        <div id="slide5">Slide5</div>
        <div id="slide_main">SlideMain</div>
     </div>

Answer 1

您还可以选择父 div 并循环遍历其中包含的所有 div，

$("#slideshow > div").each(function(){
      var id = $(this).attr("id");
      if(id == "slide_main"){
           //Do Something
      }  
    }
);

这将为 jQuery 选择器提供一个上下文，因此只会查找幻灯片 div 中的 div，而不是整个 DOM。

Answer 2

根据您的标记，看起来您正在做某种幻灯片/循环的事情。任何好的幻灯片/循环插件都会在某些事情发生时具有回调函数，因此您应该很容易地说出类似的话：

$('#slideshow').cycle({onChange: function () {
    if ($('#slideshow div:last').is('.active')) {
        $('#slideshow').cyce('stop');
    }
}});

显然，类和回调函数的名称会因插件而异。

Answer 3

非常简单，只需循环遍历所有

即可

<div class="image"></div>
<div class="image"></div>
<div class="image"></div>
<div class="image"></div>


$('div.image').each(function(){
     // do stuff
});