ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

关于js中clearInterval()无法在if语句中停止定时器的解决办法

2021-06-20 20:32:05  阅读:387  来源: 互联网

标签:定时器 random window innerHTML clearInterval flag var js


都知道setInterval()需要使用clearInterval()来停止,但也有无法停下来的时候。

这是一个随机点名的生成器,但是只能开始无法停止。

上一段错误代码

		<script>
			var nameList=new Array("张三", "李四", "王五", "小淘气", "张无忌", "段誉", "乔峰");
		function random(){
			var msg=document.getElementById("rollcall");
			var random=parseInt(Math.random()*7);
			msg.innerHTML=nameList[random];
		}
		function timer(){	
			var b=document.getElementById("button");
			if(b.innerHTML=="开始"){
			var flag=window.setInterval("random()",100);
			b.innerHTML="停止";
			return ;
			}else if(b.innerHTML=="停止"){
			window.clearInterval(flag);
			b.innerHTML="开始";
			return i=0;
			}
		}
		</script>

<body>
	<div ><p id="rollcall">随机点名器</p></div>
			<div > <center><button id="button" style="background-color: red; " onclick="timer()" >开始</button></center></div>
</body>

使用clearInterval()无法停下来,会一直随机下去。

想要解决这个问题,首先我们应该设置 一个全局变量 var flag=null;

var flag=null;
function timer(){	
			var b=document.getElementById("button");
			if(b.innerHTML=="开始"){
			flag=window.setInterval("random()",100);
			b.innerHTML="停止";
			return ;
			}else if(b.innerHTML=="停止"){
			window.clearInterval(flag);
			b.innerHTML="开始";
			return ;
			}
			
		}

或者不实用全局变量 使用将flag设置为window对象

function timer(){	
			var b=document.getElementById("button");
			if(b.innerHTML=="开始"){
			window.flag=window.setInterval("random()",100);
			b.innerHTML="停止";
			return ;
			}else if(b.innerHTML=="停止"){
			window.clearInterval(flag);
			b.innerHTML="开始";
			return ;
			}
			
		}

这样也是可以的。

之所以会出现这样是因为flag为局部变量不能作为参数传递。应该使用全局变量或者window对象来传递。

参考https://blog.csdn.net/yulongxue/article/details/94742011

标签:定时器,random,window,innerHTML,clearInterval,flag,var,js
来源: https://blog.csdn.net/duan_yuer/article/details/117968708

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有