Question

我有这两个div，想知道如何每隔3秒显示第二个（box2）div。

<div id="box1" style="background-color:#0000FF">
     <h3>This is a heading in a div element</h3>

    <p>This is some text in a div element.</p>
</div>
<div id="box2" style="background-color:red">
     <h3>This is a heading in a div element</h3>

我怎么能用jquery做到这一点？

我在这里创造了一个小提琴。 http://jsfiddle.net/jRmrp/5/

更新1

Khanh TO给出的答案有效，但我想知道当div计数超过2时该怎么办。它只允许两个。

Answer 1

你需要这个吗？

setInterval(function(){
     $("#box2").toggle();
    $("#box1").toggle();
},3000);

DEMO

更新了新要求：

var currentIndex = 0;
$(".box:not(:eq("+ currentIndex +"))").hide();

var totalDiv = $(".box").length;

setInterval(function(){
     currentIndex = (currentIndex + 1) % totalDiv;

    $(".box").hide();
     $(".box").eq(currentIndex).show();

},3000);

DEMO

Answer 2

jsFiddle demo

doBoxBlink = setInterval(blink, 1500);

function blink() {
    $('#box2').toggle();
}

使用jquery每3秒显示一次div

2 个答案: