免费获取验证码实现倒数60秒

最新推荐文章于 2024-08-05 07:15:52 发布

转载最新推荐文章于 2024-08-05 07:15:52 发布 · 613 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/family-626-77/p/5430638.html

文章标签：

#javascript #ViewUI

本文介绍了一种使用JavaScript实现的倒计时验证码按钮功能。该功能通过设置定时器自动减少重新发送验证码所需的等待时间，并在倒计时结束后恢复按钮状态。文章提供了完整的HTML和JavaScript代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript"> 
var countdown=60; 
function settime(obj) { 
    if (countdown == 0) { 
        obj.removeAttribute("disabled");    
        obj.value="免费获取验证码"; 
        countdown = 60; 
        return;
    } else { 
        obj.setAttribute("disabled", true); 
        obj.value="重新发送(" + countdown + ")"; 
        countdown--; 
    } 
setTimeout(function() { 
    settime(obj) }
    ,1000) 
}
 
</script>
<body> 
<input type="button" id="btn" value="免费获取验证码" onclick="settime(this)" /> 
 
</body>
</html>