87,997
社区成员
发帖
与我相关
我的任务
分享为什么setInterval()定时器执行时输出顺序会有问题？？？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<a href="javascript:;" onclick="tDMotion(5)">加载特定数据</a>
</body>
<script src="js/jquery-1.11.2.min.js"></script>
<script>
function commonMotion(num){
var i = 0;
commonMotionId = setInterval(function(){
i++;
console.log("i"+"====="+i+"==="+commonMotionId);
if(i == num){
i = 0;
}
},800);
};
var tDMotionId = null;
function tDMotion(num){
console.log(commonMotionId);
clearInterval(commonMotionId);
var b = 0;
//为什么不能在function()提供参数来传递数据了？
tDMotionId = setInterval(function(){
//b++;
if(b<num){
b++;
console.log("b"+"====="+b+"==="+tDMotionId);
}else if(b == num){
setInterval(tDMotionId);
commonMotion(20)
}
},800);
};
$(function(){
commonMotion(10);
});
</script>
</html>
问题：
为什么当tDMotionId定时器的变量b放在if语句内，再点击加载特定数据后在运行名为tDMotionId定时器方法后再调用名为commonMotionId定时器后，而它输出数据却是乱了而且其定时器方法的周期也失效了，这是为什么了？而把tDMotionId定时器的变量b放在if语句上面就不会出错，它们的数据却不会出错的，它们的定时器方法是无误的，这又是为什么了？
...全文
请发表友善的回复…
发表回复
I_am_a_Beginner 2016-09-10
- 打赏
- 举报
前辈我添加你的代码后还是不行喔，但把你那个红色的代码替换setInterval(tDMotionId);它们的顺序就不会乱了，还是你的红色说明点醒了我，太感谢你了！！！
天际的海浪 2016-09-09
- 打赏
- 举报
function tDMotion(num){
console.log(commonMotionId);
clearInterval(commonMotionId);
var b = 0;
//为什么不能在function()提供参数来传递数据了？
clearInterval(tDMotionId);//在创建新定时器之前先取消上一次的定时器，不然会有两个一样的定时器在同时执行
tDMotionId = setInterval(function(){
//b++;
if(b<num){
b++;
console.log("b"+"====="+b+"==="+tDMotionId);
}else if(b == num){
setInterval(tDMotionId);
commonMotion(20)
}
},800);
};
I_am_a_Beginner 2016-09-09
- 打赏
- 举报
不行喔！有没有了解setInterval定时器方法运行原理的前辈啊，真想知道为什么啊？？？
time倾听下 2016-09-09
- 打赏
- 举报
兄台，你的commonMotionId未定义吧，还有var tDMotionID=null 要放到 function tdMotion()里面吧，没玩过JS的定时器，说的不对，多包涵
