javascript 使用 jQuery 在特定时间间隔显示和隐藏 div，但停止最后一个 div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13618669/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Show and hide divs at a specific time interval using jQuery but stop the last div
提问by lala90
I need code to automatically hide div1and show div2after a specific amount of time, say 10sec or 15sec.
I read this post :
Show and hide divs at a specific time interval using jQuery,
我需要代码在特定时间后自动隐藏div1和显示div2，比如 10 秒或 15 秒。
我读过这篇文章：
使用 jQuery 在特定时间间隔显示和隐藏 div，
but it repeats every 10 seconds. I just need to hide div1and show div2once.
但它每 10 秒重复一次。我只需要隐藏div1和显示div2一次。
回答by nnnnnn
Assuming that your divs have the ids "div1"and "div2", and that "div1"starts out visible and "div2"starts out hidden, then you can hide the first and show the second after xmilliseconds like this:
假设您的 div 具有 id"div1"和"div2“，并且"div1"开始可见并"div2"开始隐藏，那么您可以隐藏第一个并在x毫秒后显示第二个，如下所示：
$("#div1").delay(10000).hide(0, function() {
$("#div2").show();
});
You can use .fadeOut()and .fadeIn()or other animation methods instead of .hide()and .show()if you like.
如果您愿意，您可以使用.fadeOut()and.fadeIn()或其他动画方法代替.hide()and .show()。
Put the above code inside a document ready handler if the intention is for this to happen automatically, or in a click handler or whatever if it is in response to something the user does.
将上面的代码放在文档就绪处理程序中，如果目的是让这自动发生，或者放在点击处理程序中，或者如果它是为了响应用户所做的事情。
Demo: http://jsfiddle.net/s7NXz/
演示：http: //jsfiddle.net/s7NXz/
If you have more than two divs and you want to cycle through them exactly once you can do something like this:
如果你有两个以上的 div 并且你想在它们之间循环一次，你可以做这样的事情：
var $divs = $("div").hide(), // use an appropriate selector here
current = 0;
$divs.eq(0).show(); // show the first
function showNext() {
if (current < $divs.length - 1) { // if not past the end then
$divs.eq(current).delay(2000).fadeOut('fast', function() {
current++;
$divs.eq(current).fadeIn('fast');
showNext();
});
}
}
showNext();
回答by Anees Sadeek
First div1is visible and div2is hidden. To show div2and hide div1after a specific time, you can add a common class, x:
第一个div1是可见的，div2是隐藏的。要在特定时间后显示div2和隐藏div1，您可以添加一个公共类，x：
$('.x').delay(1000).toggle();
You can adjust delay and toggle speed. Toggle will display matching hidden elements and hide matching shown elements.
See jQuery toggle docs
您可以调整延迟和切换速度。Toggle 将显示匹配的隐藏元素并隐藏匹配的显示元素。
请参阅jQuery 切换文档
回答by Man Programmer
$('html').addClass('js');
$(function() {
var timer = setTimeout( showDiv, 5000);
var counter = 0;
function showDiv() {
if (counter ==0) { counter++; return; }
$('div','#container')
.stop()
.hide()
.filter( function() { return this.id.match('div' + counter); })
.show('fast');
counter == 3? counter = 0 : counter++;
}
});
use setTimeout in place of setInterval
使用 setTimeout 代替 setInterval
回答by Purnendu Sarkar
$("button").click(function(){
$("p").hide(1000);
alert("The paragraph is now hidden");
});
