我有这个代码
var timeout = 0;
$('#container td').each(function(){
var td = this;
setTimeout(function() {
var new_text = $(td).find(text).html();
popup_text.html(new_text);
popup.fadeIn('fast').delay(1000).fadeOut('slow');
}, timeout);
timeout += 1000 + 1000;
});
我从表格单元格中获取文本并延迟显示在图层中。 1个问题:如何让这段代码无限循环运行? 2 问题:鼠标悬停在popop循环上时暂时停止然后继续怎么办? 非常感谢!
最佳答案
一种方法是将要重复的代码放在一个函数中,让函数在最后重复自己:
var timeout = 1000;
var action = function() {
// Do stuff here
setTimeout(action, timeout);
};
action();
但是,正如 ahren 所建议的,setInterval 可能会更好:
var timeout = 1000;
var action = function() {
// Do stuff here
};
setInterval(action, timeout);
差别很小,但是如果机器由于某种原因运行缓慢,setInterval 版本平均每秒运行一次代码,而 setTimeout 版本最多每秒运行一次代码。
然而,这些方法都不能很好地与 each() 配合使用,因此您需要将弹出窗口的序列存储在某处并逐步执行它们:
var timeout = 1000;
var tds = $('#container td');
var index = 0;
var action = function() {
var td = tds[index];
var new_text = $(td).html();
popup.html(new_text);
popup.fadeIn('fast').delay(1000).fadeOut('slow');
if(++index >= tds.length)
index = 0;
};
setInterval(action, timeout);
action();
最后,为了避免在悬停弹出窗口时移动到下一个弹出窗口,您可以在函数的开头添加一个检查。还需要重新排列动画,以便它们“检查悬停 - 淡出 - 更改文本 - 淡入”。
var timeout = 1000;
var tds = $('#container td');
var index = 0;
var action = function() {
if(popup.is(':hover'))
return;
var td = tds[index];
var new_text = $(td).html();
popup.fadeOut('slow', function() {
popup.html(new_text);
}).fadeIn('fast');
if(++index >= tds.length)
index = 0;
};
setInterval(action, timeout);
action();
jsFiddle:http://jsfiddle.net/qWkYE/2/
关于javascript - Jquery:无限循环和暂停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12100483/