我只需要通过3个元素的变体创建一个无限循环。这就是我到目前为止所做的:
var count = 1;
setTimeout(transition, 2000);
function transition() {
if(count == 1) {
$('#ele').html('variation 2');
var count = 2;
} else if(count == 2) {
$('#ele').html('variation 3');
var count = 3;
} else if(count == 3) {
$('#ele').html('variation 1');
var count = 1;
}
setTimeout(transition, 2000);
}
答案 0 :(得分:18)
试试:
var count = 1;
function transition() {
if(count == 1) {
$('#ele').html('variation 2');
count = 2;
} else if(count == 2) {
$('#ele').html('variation 3');
count = 3;
} else if(count == 3) {
$('#ele').html('variation 1');
count = 1;
}
}
setInterval(transition, 2000);
答案 1 :(得分:13)
如果你想要一个无限循环,你应该使用setInterval()
。这将运行无限循环,每次运行下一个变体:
var i=0;
setInterval(function() {
switch(i++%3) {
case 0: alert("variation 1");
break;
case 1: alert("variation 2");
break;
case 2: alert("variation 3");
break;
}
}, 2000);
如果您以后决定需要停止重复代码,请在设置间隔时存储返回值并清除它:
var intervalId = setInterval(function() {
...
}, 1000);
clearInterval(intervalId);
答案 2 :(得分:2)
这是最佳解决方案:
clearTimeout()方法清除使用 setTimeout()方法设置的计时器。
(function(){
var timer, count=1;
function transition(){
clearTimeout(timer);
switch(count){
case 1: count = 2; break;
case 2: count = 3; break;
case 3: count = 1; break;
}
$('#ele').html('variation ' + count);
timer = setTimeout(transition, 2000);
}
transition();
})();
答案 3 :(得分:0)
var
函数中的count
变量前面有transition
个count
。删除它们,外部{{1}}变量将保留其值。
答案 4 :(得分:0)
如果您仍想使用 setTimeout 和 clearTimeout 来创建循环 你应该为你的循环使用这样的结构
var count = 1;
var timer = setTimeout( function(){
transaction();
} , 2000);
function transition() {
if(count == 1) {
$('#ele').html('variation 2');
count = 2;
} else if(count == 2) {
$('#ele').html('variation 3');
count = 3;
} else if(count == 3) {
$('#ele').html('variation 1');
count = 1;
}
//if(condition for continue)
setTimeout(transition, 2000);
//else if you want to stop the loop
//clearTimeout(timer, 2000);
}
答案 5 :(得分:0)
在现实生活中,我最好的工作方式是在这种情况下使用"忘记基本循环" ,并使用" setInterval"包括" setTimeOut" s:
function iAsk(lvl){
var i=0;
var intr =setInterval(function(){ // start the loop
i++; // increment it
if(i>lvl){ // check if the end round reached.
clearInterval(intr);
return;
}
setTimeout(function(){
$(".imag").prop("src",pPng); // do first bla bla bla after 50 millisecond
},50);
setTimeout(function(){
// do another bla bla bla after 100 millisecond.
seq[i-1]=(Math.ceil(Math.random()*4)).toString();
$("#hh").after('<br>'+i + ' : rand= '+(Math.ceil(Math.random()*4)).toString()+' > '+seq[i-1]);
$("#d"+seq[i-1]).prop("src",pGif);
var d =document.getElementById('aud');
d.play();
},100);
setTimeout(function(){
// keep adding bla bla bla till you done :)
$("#d"+seq[i-1]).prop("src",pPng);
},900);
},1000); // loop waiting time must be >= 900 (biggest timeOut for inside actions)
}
PS:理解(setTimeOut)的真实行为:它们都将在同一时间开始&#34;三个bla bla bla将在同一时刻开始倒计时#34;所以要做一个不同的超时来安排执行。
PS 2:定时循环的示例,但对于反应循环,您可以使用事件,承诺异步等待..
答案 6 :(得分:0)
awk 'FNR%4==1' filename
$(document).ready(function () {
$("[data-count]").each(function () {
counter($(this), .5)
});
function counter(el, speed) {
let number = el.data("count"),
count_type = el.data("count-type"),
i = count_type === "up" ? 0 : number;
let inter_val = setInterval(function () {
el.text(i);
i = count_type === "up" ? i + 1 : i - 1;
if ((count_type === "up" && i > number) || (count_type === "down" && i < 0))
clearInterval(inter_val);
}, speed);
}
});
span {
background-color: #eeeeee;
color: #333;
padding: 15px 25px;
margin: 10px;
display: inline-block;
width: 100px;
text-align: center;
}