javascript - Js防止按钮重复点击的方法?
巴扎黑
巴扎黑 2017-04-11 12:58:01
[JavaScript讨论组]

有哪几种比较好的实现,不想让按钮在短时间重复点击多次

巴扎黑
巴扎黑

全部回复(2)
黄舟

表单元素

disabled 没有之一。

el.prop('disabled', true);
ajax({}).done(function() { el.prop('disabled', false); });

非表单元素

非表单,自然没有 disabled 之说,但可以借助中间变量。

if (el.data().loading === true) return false;
el.data('loading', true);
ajax({}).done(function() { el.data('loading', false); });

配合CSS

最后再配合css就更完美了。

.disabled, button[disabled] { background-color:#ddd; }
PHPz

下面的例子用jquery。
解决思路,设置一个条件来触发事件:

当条件为真时,执行
条件为假时不执行。

那么问题来了,怎么设置条件 ?

可以用setTimeout函数来改变条件的值。

例子

    function runa(){
          console.log('is run');
      }
      var isRun=true;
     $("#set").click(function(){
         if(isRun){
             runa();
             isRun=false;
         }
         setTimeout(function(){
             isRun=true;
         },1500) //点击后相隔多长时间可执行
     })
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号