JS实现禁止高频率连续点击的方法【基于ES6语法】


Posted in Javascript onApril 25, 2017

本文实例讲述了JS实现禁止高频率连续点击的方法。分享给大家供大家参考,具体如下:

1、类似react的数据流,点击之后立即设置值为空,当返回值后才可以点击

2、设置定时器,每次进入之前先清空掉定时器,然后开启定时器

<main>
  <div id="me" style="width: 100px;height: 50px; margin: 5rem auto;background: blue;color: #fff">点我</div>
</main>
<script>
  let c =null;
  let dom = document.querySelector('#me');
  dom.addEventListener('click',function(){
    clearTimeout(c);
    c = setTimeout(function(){
      console.log(2000)
    },1000)
  },false)
</script>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
让iframe子窗体取父窗体地址栏参数(querystring)
Oct 13 Javascript
不同浏览器对回车提交表单的处理办法
Feb 13 Javascript
Jquery实现仿腾讯微博发表广播
Nov 17 Javascript
jQuery在ul中显示某个li索引号的方法
Mar 17 Javascript
移动端横屏的JS代码(beta)
May 16 Javascript
js实现PC端根据IP定位当前城市地理位置
Feb 22 Javascript
vue2实现移动端上传、预览、压缩图片解决拍照旋转问题
Apr 13 Javascript
electron中使用bootstrap的示例代码
Nov 06 Javascript
微信 jssdk 签名错误invalid signature的解决方法
Jan 14 Javascript
vue动态添加路由addRoutes之不能将动态路由存入缓存的解决
Feb 19 Javascript
elementUI vue this.$confirm 和el-dialog 弹出框 移动 示例demo
Jul 03 Javascript
一篇文章带你搞懂Vue虚拟Dom与diff算法
Aug 25 Javascript
json的结构与遍历方法实例分析
Apr 25 #Javascript
详谈jQuery中使用attr(), prop(), val()获取value的异同
Apr 25 #jQuery
用vue和node写的简易购物车实现
Apr 25 #Javascript
ES6数组的扩展详解
Apr 25 #Javascript
Angular实现一个简单的多选复选框的弹出框指令实例
Apr 25 #Javascript
如何在 Vue.js 中使用第三方js库
Apr 25 #Javascript
Javascript中click与blur事件的顺序详析
Apr 25 #Javascript
You might like
PHP中echo,print_r与var_dump区别分析
2014/09/29 PHP
浅析php单例模式
2014/11/25 PHP
ThinkPHP5 验证器的具体使用
2018/05/31 PHP
如何用javascript去掉字符串里的所有空格
2007/02/08 Javascript
小型js框架veryide.librar源代码
2009/03/05 Javascript
javascript event 事件解析
2011/01/31 Javascript
javascript中文本框中输入法切换的问题
2013/12/10 Javascript
js由下向上不断上升冒气泡效果实例
2015/05/07 Javascript
js获取url传值的方法
2015/12/18 Javascript
jQuery实现下拉加载功能实例代码
2016/04/01 Javascript
JS小数转换为整数的方法分析
2017/01/07 Javascript
Vue.js学习之计算属性
2017/01/22 Javascript
jQuery编写textarea输入字数限制代码
2017/03/23 jQuery
使用angular帮你实现拖拽的示例
2017/07/05 Javascript
简单实现js轮播图效果
2017/07/14 Javascript
分享vue里swiper的一些坑
2018/08/30 Javascript
详解Vue+elementUI build打包部署后字体图标丢失问题
2020/07/13 Javascript
vue.js实现h5机器人聊天(测试版)
2020/07/16 Javascript
小程序实现上传视频功能
2020/08/18 Javascript
[01:10:16]DOTA2上海特级锦标赛B组资格赛#2 Fnatic VS Spirit第一局
2016/02/27 DOTA
python 远程统计文件代码分享
2015/05/14 Python
python实现备份目录的方法
2015/08/03 Python
python3+PyQt5使用数据库窗口视图
2018/04/24 Python
如何基于python操作json文件获取内容
2019/12/24 Python
Python遍历字典方式就实例详解
2019/12/28 Python
Selenium alert 弹窗处理的示例代码
2020/08/06 Python
分享PyCharm最新激活码(真永久激活方法)不用每月找安装参数或最新激活码了
2020/12/27 Python
HTML5实现桌面通知 提示功能
2017/10/11 HTML / CSS
高性能装备提升营地:Kammok
2019/02/27 全球购物
服务员自我评价
2014/01/25 职场文书
药品促销活动方案
2014/02/14 职场文书
违反校纪校规检讨书
2014/02/15 职场文书
工作证明范本(2篇)
2014/09/14 职场文书
2014最新自愿离婚协议书范本
2014/11/19 职场文书
导游词之潮音寺
2019/09/26 职场文书
使用vuex-persistedstate本地存储vuex
2022/04/29 Vue.js