-1

我正在使用的以下代码工作正常，它可以满足我的要求，但它看起来真的很草率，并且想要实现“replaceWith”功能以使其更清洁。
我想显示 div1 10 秒，隐藏 div，然后显示 div2 10 秒，隐藏 div 并显示 div3 等...有人可以帮我使用 replaceWith 功能清理它。

<script type="text/javascript">
jQuery(function($){
setTimeout(function() {
$('#below-post-block-1').hide();},
10000); 
});

jQuery(function($){
setTimeout(function() {
$('#below-post-block-2').show();},
10000); 
});

jQuery(function($){
setTimeout(function() {
$('#below-post-block-2').hide();},
20000); 
});

jQuery(function($){
setTimeout(function() {
$('#below-post-block-3').show();},
20000); 
});

</script>

在此先感谢-保罗

4

2 回答 2

0

用来settimeout让它工作。

HTML

<div id="d1" style="background-color:red;height:100px"></div>
<div id="d2" style="background-color:green;height:100px;display:none"></div>
<div id="d3" style="background-color:blue;height:100px;display:none"></div>
<div id="d4" style="background-color:yellow;height:100px;display:none"></div>

检查小提琴

于 2013-11-04T07:31:12.793 回答
0

有很多方法可以实现这种行为，如果您想使用replaceWith功能，我将向您展示一个示例：http: //jsfiddle.net/Jm3Wj/1/

Javascript

var divs = [$('#a'),$('#b'),$('#c'),$('#d'),$('#e')]
var currentIndex = 0;
setInterval(function(){
    var temp  = divs[currentIndex];
    var nextIndex = currentIndex+1;
    if(nextIndex == divs.length)
        nextIndex = 0;
    divs[currentIndex].replaceWith(divs[nextIndex]);
    divs[nextIndex].show();
    console.log(nextIndex);
    divs[currentIndex] = temp;    
    currentIndex = nextIndex;

},1000);

HTML

<div id="a" class="firstDiv">a</div>
<div id="b">b</div>
<div id="c">c</div>
<div id="d">d</div>
<div id="e">e</div>

CSS

div{
    display:none;
}
.firstDiv{
     display:block;   
}
于 2013-11-04T07:38:38.480 回答