js控制按键在规定时间内的可操作性

最新推荐文章于 2026-06-06 11:12:44 发布

原创最新推荐文章于 2026-06-06 11:12:44 发布 · 2.4k 阅读

4 ·

本内容遵循CC 4.0 BY-SA版权协议

Web开发专栏收录该内容

36 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的验证码按钮功能，点击后按钮会变为灰色，并开始60秒倒计时，在倒计时结束后按钮恢复为可点击状态。此方案适用于网页表单中的验证码发送场景。

<html> 
<head> 
<title>点击获取验证码按钮后按钮变灰，倒计时一60s后又可重复点击</title> 
</head> 
<body> 
<input type="button" id="btn" value="免费获取验证码" /> 
<script type="text/javascript"> 
var wait=60; 
function time(o) { 
        if (wait == 0) { 
            o.removeAttribute("disabled");           
            o.value="免费获取验证码"; 
            wait = 60; 
        } else { 
            o.setAttribute("disabled", true); 
            o.value=wait+"秒后可以重新发送"; 
            wait--; 
            setTimeout(function() { 
                time(o) 
            }, 
            1000) 
        } 
    } 
document.getElementById("btn").onclick=function(){time(this);} 
</script> 
</body> 
</html>