JavaScript中 setInterval和setTimeout事件的方法 和区别

setInterval: setInterval 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式,停止该方法可使用 clearInterval 方法

setTimeout :setTimeout 方法用于在指定的毫秒数后调用函数或计算表达式。停止该方法可使用 clearTimeout 方法。

区别:setTimeout() 只执行代码块一次。如果要多次调用,请使用 setInterval() 或者让代码块自身再次调用 setTimeout()。

setTimeout调用方式:

//setTime()内部再次调用setTimeout,如果内部不用setTimeout调用setTime()方法,setTime()只会执行一次。
var timeId ;
var countdown = 60;
var dom = $('#getCodeBtn');
function setTime() {
	if (countdown == 0) {
		$(dom).attr("disabled", false);
		$(dom).text("获取验证码");
	} else {
		$(dom).attr("disabled", true);
		$(dom).text("重新发送(" + countdown + ")");
	}
	if(countdown == 0){
		clearTimeout(timeId);
		countdown = 3;
	}else{
		countdown--;
		timeId = setTimeout(function(){
			setTime();
		},1000);			
	}	
}
		
function getRegCode() {
	setTime();
}

setInterval调用方式

//setInterval:setTime()函数内部无需再次调用,setInterval会每隔1000毫秒(1秒)执行一次setTime()函数
var timeId ;
var countdown = 60;
var dom = $('#getCodeBtn');
function setTime() {
	if (countdown == 0) {
		$(dom).attr("disabled", false);
		$(dom).text("获取验证码");
		clearTimeout(timeId);
		countdown = 60;
	} else {
		$(dom).attr("disabled", true);
		$(dom).text("重新发送(" + countdown + ")");
		countdown--;
	}	
}
	
function getRegCode() { 
	timeId = setInterval("setTime()", 1000);
}

猜你喜欢

转载自my.oschina.net/u/2433960/blog/1031131
今日推荐