无为清净楼资源网 Design By www.qnjia.com
计时器和延时器的概念
//--计时器
// 计时器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>
//--计时器
// 计时器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>
标签:
禁用按钮,解除禁用
无为清净楼资源网 Design By www.qnjia.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
无为清净楼资源网 Design By www.qnjia.com
暂无评论...
更新日志
2024年11月18日
2024年11月18日
- 黑鸭子2006-红色经典特别版[首版][WAV+CUE]
- 赵乃吉《你不是风平浪静的海》[320K/MP3][84.88MB]
- 赵乃吉《你不是风平浪静的海》[FLAC/分轨][176.46MB]
- 群星《心光》[320K/MP3][227.63MB]
- 张秀卿.1997-我不是无情的人【巨石】【WAV+CUE】
- 群星.1986-宝丽金难忘的回忆【宝丽金】【WAV+CUE】
- 王艺翔.2024-至暖(EP)【乐人】【FLAC分轨】
- 樊桐舟《流年微词HQCD》WAV+CUE
- Rachmaninoff-SymphonicDances-BerlinerPhilharmoniker,KirillPetrenko(2024)[24-96]
- 岡部啓一《NieRGestaltReplicantOrchestralArrangementAlbum》24-96\FLAC
- 群星《心光》[FLAC/分轨][307.76MB]
- 许茹芸《讨好》[WAV+CUE][1G]
- 唐磊《丁香花》[WAV+CUE]
- 刘德华.2001-天开了【BMG】【WAV+CUE】
- 群星.2013-顾嘉辉大师经典演唱会3CD【爱我音乐】【WAV+CUE】