当前位置：翔宇亭IT乐园 → IT知识库 → WEB → 推广优化

JavaScript中clearInterval函数的应用

减小字体

增大字体作者：biye5u.com 来源：本站原创发布时间：2012-02-03 00:58:21

一般情况clearInterval函数要和setInterval函数配合使用，其主要是用来取消由setInterval函数设置的事件执行间隔，其语法形式如下

clearInterval(id_of_setinterval)

id_of_setinterval既是由setInterval() 返回的ID值，即要取消ID为id_of_setinterval的对象的setInterval事件，该方法没有返回值。

下面举一个例子来说明一下clearInterval()方法的使用

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>clearInterval()的使用方法——翔宇亭IT乐园（www.biye5u.com）</title> <script language=javascript> var timerId = null; function curDT() { var dt = new Date(); var curDate = dt.getFullYear()+"年" + dt.getMonth()+"月"+dt.getDay()+"日"; var curTime = dt.getHours()+":"+dt.getMinutes()+":"+dt.getSeconds(); var curDateTime = curDate + " " + curTime; document.getElementById("curDateTime").innerHTML="现在时间为：" + curDateTime; } function beginDT() { timerID = setInterval(curDT,1000); //每1000毫秒刷新一次时间，即1秒钟刷新一次时间 document.getElementById("btnBegin").disabled = true; document.getElementById("btnStop").disabled = false; } function stopDT() { clearInterval(timerID); document.getElementById("btnBegin").disabled = false; document.getElementById("btnStop").disabled = true; } beginDT(); </script> </head> <body> <h1>clearInterval方法的使用</h1> <p>点击【时钟运行】，则开始显示当前日期和时间，点击【时钟停止】，则停止显示当前日期和时间。</p> <p id="curDateTime">现在的时间为：</p> <input type="button" value="时钟运行" id="btnBegin" disabled="disabled" onclick="javascript:beginDT();" /> <input type="button" value="时钟停止" id="btnStop" onclick="javascript:stopDT();" /> </body> </html>