javascript定时器函数开始和结束代码实例
分类：实例代码
本章节分享一段代码实例，它演示了setTimeout()定时器函数开始执行和结束效果。
代码实例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.pipipi.net/" />
<title>前端教程网</title>
<script type="text/javascript">
var timer = null;
function begin(){
var date = new Date();
var current_time = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' ';
current_time += date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();
document.getElementById('current_time').value = current_time;
timer = setTimeout('begin()', 1000);
}
function stop() {
//清除掉定时器对象
clearTimeout(timer);
}
window.onload=function(){
var start=document.getElementById("start");
var end=document.getElementById("end");
start.onclick=function(){begin();}
end.onclick=function(){stop();}
}
</script>
</head>
<body>
<input type="text" name="current_time" id="current_time"/>
<input type="button" id="start" value="开始"/>
<input type="button" id="end" value="结束"/>
</body>
</html>
上面的代码演示了定时器函数的用法，下面介绍一下它的实现过程。
一.代码注释:
（1）.var timer = null，声明一个变量并赋值为null,用来存储定时器函数的返回值。
（2）.function begin(){}，此函数能够实现获取当前时间日期的功能，定时器函数就是对它的调用。
（3）.var date = new Date()，创建一个事件日期对象。
（4）.var current_time = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' '，获取年月日。
（5）.current_time += date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds()，连接获取的小时、分钟和秒。
（6）.document.getElementById('current_time').value = current_time，给文本框赋值。
（7）.me').value = current_time,使用递归的方式不断调用begin函数。
（8）.function stop() {
//清除掉定时器对象
clearTimeout(timer);
}，停止定时器函数的执行。
二.相关阅读:
（1）.关于时间对象可以参阅JavaScript Date 对象一章节。
（2）.setTimeout()可以参阅setTimeout()一章节。
（3）.clearTimeout()可以参阅clearTimeout()方法一章节。
一线大厂高级前端编写，前端初中阶面试题，帮助初学者应聘，需要联系微信：javadudu