jquery 一个简单的定时器 setInterval() ，clearInterval()

一个简单的定时器 setInterval()， clearInterval()用法，经常使用的场景是，验证码的发送，啥都不说直接上代码

<script>
var clock = '';
var nums = 120;
function sortMessage(){
	var tel = $("#managerTel").val();
	if(!tel){
		alertError("请输入电话号码");
		return;
	}
	$.reqWeb({
		url:"/public/register/shortMessage.xhtml", //调用java后台代码发送验证码
		async: false,
		data:{tel:tel},
		dataType:'json',
		success:function(data){
			if(data.state=="OK"){
				alertOk("验证码发送成功，请在手机上查看");
				$("#btn").attr("disabled", true); //将按钮置为不可点击
				$("#btn").val(nums+'秒后可重新获取验证码');//倒计时
				clock = setInterval(countDown, 1000); //一秒执行一次
			}
		},
		error:function(data){
			console.log(data);
			alertError("系统繁忙，请稍后再试");
		}
	});
}

function countDown(){
	nums--;
	if(nums > 0){
		$("#btn").val(nums+'秒后可重新获取');
	}else{
	 clearInterval(clock); //清除js定时器
	 $("#btn").attr("disabled", false);
	 $("#btn").val('发送验证码');
	 nums = 120; //重置时间
	}
}

</script>

说明：

1.方法说明

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数

2.定义

setInterval(code,millisec[,"lang"])

code：要调用的函数或要执行的代码串。必须参数不能省略

millisec：必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。

3.返回值

一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。

4.实例

<html>
<body>

<input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
  {
  var t=new Date()
  document.getElementById("clock").value=t
  }
</script>
</form>
<button onclick="int=window.clearInterval(int)">
Stop interval</button>

</body>
</html>

秒客网

jquery 一个简单的定时器 setInterval() ，clearInterval()

相关文章