Posted in Javascript onFebruary 19, 2014
计时器和延时器的概念
//--计时器
// 计时器ID号 setInterval(回调函数, 毫秒数);
// 每隔指定毫秒数,调用一次回调函数
// clearInterval(计时器ID号)
// 停止指定ID号的计时器(实际上是销毁释放资源了)
//--延时器
// 延时器Id号 setTimeout(回调函数, 毫秒间隔)
// 从调用开始,等待指定毫秒数后调用一次回调函数,结束
// 使用clearTimeout清除延时器
效果图:
页面打开后会出现下图:之后按钮value值每过1秒 数字减小1直至0停止 按钮内容变为同意
实现代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> #btn { width:200px; height:50px; background -color:gary; } </style> <script type="text/javascript"> onload = function () { //获得该button对象 var btn = document.getElementById('btn'); //创建计时器 返回计时器ID var intervalId = setInterval(function () { var waitSecond = parseInt((/\d+/).exec(btn.value));//利用RegExp.exec()方法,返回匹配的字符串内容 waitSecond--;//时间-- if (waitSecond >= 0) {//判断 btn.value=btn.value.replace(/\d+/, waitSecond) //利用string.repleace(RegExp,code)方法替换按钮value中数字,并返回替换结果 } else { btn.value = '同意';//将按钮value值改为同意 btn.disabled = false;//将按钮disabled值改为false clearInterval(intervalId);//清除计时器 } }, 1000); }; </script> </head> <body> <input type="button" name="name" value="请仔细阅读5秒后点击同意继续" id="btn" disabled="disabled"/> </body> </html>
页面按钮禁用与解除禁用的方法
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@