按钮发送验证码等待时间效果——定时器setInterval使用

最新推荐文章于 2024-04-22 11:43:29 发布

呼呼伙伴

最新推荐文章于 2024-04-22 11:43:29 发布

阅读量1.8k

点赞数

分类专栏： HTML5+CSS3 文章标签：验证码 html css javascript 表单

本文链接：https://blog.csdn.net/baidu_33163851/article/details/51274832

版权

HTML5+CSS3 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<!doctype html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Document</title>
   <script type="text/javascript">
   window.onload=function(){
       var send=document.getElementById('send');
           times=60;
           timer=null;
       send.οnclick=function(){
         // 计时开始 
           timer=setInterval(function(){
            times--;
           if(times<=0){
               send.value='发送验证码';
               clearInterval(timer);
            times=60;
               send.disabled=false;    //是否可点击
           }else{
               send.value=times+'秒后重试';
               send.disabled=true;
           }console.log(times);
       },1000);
       } 
   }
   </script>
</head>
<body>
   <input type="button" id="send" value="发送验证码">
</body>
</html>

呼呼伙伴

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
按钮发送验证码等待时间效果——定时器setInterval使用

html lang="en">head> meta charset="UTF-8"> title>Documenttitle> script type="text/javascript"> window.onload=function(){ var send=document.getElementById('send'); times=
复制链接

扫一扫