前面的话

  有一天心血来潮,1分钟内重复点击了多次博客园首页的刷新博文列表的刷新按钮。果不其然,ip当时就被禁用了。后来,重启自己的路由器,重新获取ip才可以访问博客园主页。那么,设置一个限定时间内(比如1秒)防止按钮被重复点击的方法会不会更好一点呢?

思路一

  最直接的思路可能就是点击按钮后,按钮的事件绑定函数解绑,1s后重新绑定函数

<button id="btn">0</button>
<script>
btn.onclick = function add(){
btn.innerHTML = Number(btn.innerHTML) + 1;
btn.onclick = null;
clearTimeout(timer);
var timer = setTimeout(function(){
btn.onclick = add;
},1000);
}
</script>

思路二

  另一个思路是获取并记录时间,当再次点击时,时间间隔大于1s时才有效

<button id="btn">0</button>
<script>
btn.onclick = (function(){
var last = Date.now();
return function(){
var now = Date.now();
if((now - last)>1000){
btn.innerHTML= Number(btn.innerHTML) + 1;
}
last = now;
}
})();
</script>

  如果还有其他思路,欢迎交流

关于javascript中限定时间内防止按钮重复点击的思路的更多相关文章

  1. 防止按钮重复点击的思路(js篇)

    最直接的思路可能就是点击按钮后,按钮的事件绑定函数解绑,1s后重新绑定函数 <button id=</button> <script> btn.onclick = fun ...

  2. 在Activity中响应ListView内部按钮的点击事件

    最近交流群里面有人问到一个问题:如何在Activity中响应ListView内部按钮的点击事件,不要在Adapter中响应? 对于这个问题,我最初给他的解答是,在Adapter中定义一个回调接口,在A ...

  3. 在Activity中响应ListView内部按钮的点击事件的两种方法!!!

    在Activity中响应ListView内部按钮的点击事件的两种方法 转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题: ...

  4. 在Activity中响应ListView内部按钮的点击事件的两种方法

    转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题:如何在Activity中响应ListView内部按钮的点击事件,不要在 ...

  5. Andorid-解决View重复点击的思路

    Andorid-解决View重复点击的思路 转 https://www.jianshu.com/p/10d400a296fe 最近遇到一道面试题,题目是在App开发中,如何防止多次点击支付或者多次点击 ...

  6. 关于Android避免按钮重复点击事件

    最近测试人员测试我们的APP的时候,喜欢快速点击某个按钮,出现一个页面出现多次,测试人员能不能禁止这样.我自己点击了几下,确实存在这个问题,也感觉用户体验不太好.于是乎后来我搜了下加一个方法放在我们U ...

  7. React Native(十一)——按钮重复点击事件的处理

    最初开始做后台管理系统的时候,就曾遇到过这样一种场景:"快速点击确认按钮,就会对此触发确认事件,导致多次请求数据库":于是最终我们得当的通过处理那个确认button,解决了上述问题 ...

  8. 转载:Github项目解析(七)-->防止按钮重复点击

    不错的东西,记录下... http://46aae4d1e2371e4aa769798941cef698.devproxy.yunshipei.com/qq_23547831/article/deta ...

  9. 按钮重复点击问题 UIbutton

    .h #import <UIKit/UIKit.h> #import <objc/runtime.h> @interface UIControl (XY) @property ...

随机推荐

  1. HTTP 使用期及新鲜度算法

    使用期算法: /* * age_value 当代理服务器用自己的头部去响应请求时,Age标明实体产生到现在多长时间了. * date_value HTTP 服务器应答中的Date字段 原始服务器 * ...

  2. 2分钟 sublime设置自动行尾添加分号并换行:

    18:03 2016/4/162分钟 sublime设置自动行尾添加分号并换行:注意:宏文件路径要用反斜杠/,2个\\会提示无法打开宏文件.不需要绝对路径很简单利用宏定义:1.录制宏:由于是录制动作宏 ...

  3. BZOJ‘s Usaco 奶牛题集锦

    1230 线段树 1231 状压DP 1232 最小生成树 1527 贪心 1600 打表找规律 1601 最小生成树 1602 prime 1606 DP 1607 筛法 1609 DP 1610 ...

  4. knockoutjs扩展与使用

    原来考虑使用avalon2.0 经过一周的试验,能力不够,用不起来.最终使用了knockout-3.4.js <!DOCTYPE html> <html> <head&g ...

  5. View的弹性滑动

    View的弹性滑动 实现弹性滑动的思想:将一次大的滑动分成若干次小的滑动并在一个时间段内完成,具体的实现方式有很多,如通过Scroller.Handler#postDelayed以及Thread#sl ...

  6. 7_nodejs angularjs

    webstrom使用: ctrl+b/点击,代码导航,自动跳转到定义 ctrl+n跳转指定类 ctrl+d复制当前行ctrl+enter另起一行ctrl+y删除当前行 ctrl+alt/shift+b ...

  7. elasticsearch完全匹配

    $params = array( "body" => array( "query" => array( "filtered" = ...

  8. sublime text 插件(前端自用)

    一.软件安装 ST中文论坛:http://sublimetext.iaixue.com/  或者 http://sublimetext.iaixue.com/dl/#sublime_text_3103 ...

  9. 使用Python中PIL图形库进行截屏

    目的:通过使用Python的一个图形库PIL(Python Image Library)对屏幕进行截图 步骤: 1.下载PIL(路径)并安装 2.新建文件“截屏.py”,右键Edit with IDL ...

  10. dns解析慢 修改的参数

    情况: ping域名时反应速度慢,ping ip却很正常 方法一:禁用ipv6 /etc/hosts中注释ipv6相关的 vim /etc/sysconfig/networks NETWORKING_ ...