<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>定时器延时器</title> </head> <body> <input type="button" name="#" value=" 点击开始" id="btn"> <input type="button" name="#" value=" 点击停止" id="btn2"> <p id="txtbox">1</p> </body> <script type="text/javascript"> // 以下是定时器特效 // var objbtn=document.getElementById('btn'); //获取点击开始按钮对象 // var ding=''; //定义全局变量为空 // objbtn.onclick=function(){ // 点击开始按钮 运行函数方法 // if(ding==''){ // 判断全局变量是否为空 // ding=setInterval(fun,1000); // 运行定时器 fun 为运行的函数 .fun()带括号是运行函数的结果。 1000为毫秒 就是1秒钟运行一次 // } // }; // function fun(){ // document.getElementById("txtbox").innerText=parseInt(document.getElementById("txtbox").innerText)+1; // //id为txtbox元素内的值等于本身的值加一 parseInt 把获取到的值转换为整数 // } // document.getElementById('btn2').onclick=function(){ // 点击停止按钮 运行函数 // clearInterval(ding); //清除定时器 // ding=''; // } // 以下是延时器特效 var objbtn=document.getElementById('btn'); //获取点击开始按钮对象 var ding=''; //定义全局变量为空 objbtn.onclick=function(){ // 点击开始按钮 运行函数方法 if(ding==''){ // 判断全局变量是否为空 ding=setTimeout(fun,9000); // 运行延时器 fun 为运行的函数 .fun()带括号是运行函数的结果。 1000为毫秒 一秒钟后运行函数 //只运行一次是在载入后延迟指定时间后,去执行一次表达式,记住,次数是一次 } }; function fun(){ document.getElementById("txtbox").innerText=parseInt(document.getElementById("txtbox").innerText)+1; //id为txtbox元素内的值等于本身的值加一 parseInt 把获取到的值转换为整数 } document.getElementById('btn2').onclick=function(){ // 点击停止按钮 运行函数 clearTimeout(ding); //清除定时器 ding=''; } </script> </html>