setInterval()和clearInterval() 用法

setInterval()和clearInterval() 用法

一、含义(摘自百度百科)

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

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。

由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

二、需求

项目中首页需求：增加时间倒计时控件，5分钟刷新前台数据。

三、找时间控件JS

      找了好久，jquery_countdown，flipcountdown 这两种网上应用的时间倒计时插件比较多，融入工程不好融合，我选择用纯JS来实现首页倒计时。

找到一款JS写的时间倒计时，给大家分享一下连接：http://pan.baidu.com/s/1i3ITKYL

        

四、遇到问题

setInterval 一直循环增加，导致时间倒计时js开启了好几个线程，秒数一直在 --。晚上都是js外部进行调用setInterval  如何关闭 js。不知道如何内部关闭。搜索到这个帖子参考一下：http://www.jb51.net/article/35474.htm 问题得以解决。

五、总结

在不了解setInterval  用法之前，没有好好的研究最初的用法 ，w3c一带而过，http://www.w3school.com.cn/jsref/met_win_setinterval.asp

其实这句话就能解决我的问题“由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。”。要好好看基础知识，多多实践。

我的代码示例：

//倒计时总秒数量
var secondsTotal = parseInt(300);
//时间倒计时函数
function Countdown(sec)
{
	var i = window.setInterval(function()
    {
	var day=0,
		hour=0,
		minute=0,
		second=0;//时间默认值		
	if(sec > 0)
	{
		minute = Math.floor(sec / 60) - (day * 24 * 60) - (hour * 60);
		second = Math.floor(sec) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
	}
	if (minute <= 9) minute = '0' + minute;
	if (second <= 9) second = '0' + second;
	$('#minute_show').html('<s></s>'+minute+'分');
	$('#second_show').html('<s></s>'+second+'秒');
	sec--;
	if(sec==0)
	{
		 clearInterval(i);
	}
	}, 1000);
} 

//每5分钟更新一次页面
setInterval(updateHallShow,1000 * 60 * 5);

效果展示：