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 相关文章推荐
JavaScript中继承的一些示例方法与属性参考
Aug 07 Javascript
关于JavaScript的面向对象和继承有利新手学习
Jan 11 Javascript
js阻止冒泡及jquery阻止事件冒泡示例介绍
Nov 19 Javascript
JQuery 给元素绑定click事件多次执行的解决方法
Sep 09 Javascript
判断字符串的长度(优化版)中文占两个字符
Oct 30 Javascript
EasyUI实现二级页面的内容勾选的方法
Mar 01 Javascript
javascript页面倒计时实例
Jul 25 Javascript
jQuery实现默认是闭合的FAQ展开效果菜单
Sep 14 Javascript
BootStrap点击下拉菜单项后显示一个新的输入框实现代码
May 16 Javascript
微信小程序 数据绑定详解及实例
Oct 25 Javascript
Vue的data、computed、watch源码浅谈
Apr 04 Javascript
低门槛开发iOS、Android、小程序应用的前端框架详解
Oct 16 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实现与ASP Banner组件相似的类
2006/10/09 PHP
php 上一篇,下一篇文章实现代码与原理说明
2010/05/09 PHP
php实现水仙花数示例分享
2014/04/03 PHP
PHP采集类Snoopy抓取图片实例
2014/06/19 PHP
[原创]PHP字符串中插入子字符串方法总结
2016/05/06 PHP
PHP文件下载实例代码浅析
2016/08/17 PHP
PHP错误处理函数register_shutdown_function使用示例
2017/07/03 PHP
php读取本地json文件的实例
2018/03/07 PHP
收藏一些不常用,但是有用的代码
2007/03/12 Javascript
jQuery MD5加密实现代码
2010/03/15 Javascript
JavaScript 反科里化 this [译]
2012/09/20 Javascript
手机图片预览插件photoswipe.js使用总结
2016/08/25 Javascript
node.js爬虫爬取拉勾网职位信息
2017/03/14 Javascript
浅谈express 中间件机制及实现原理
2017/08/31 Javascript
windows系统下更新nodejs版本的方案
2017/11/24 NodeJs
Vue中使用Sortable的示例代码
2018/04/07 Javascript
echarts设置图例颜色和地图底色的方法实例
2018/08/01 Javascript
微信小程序点击图片实现长按预览、保存、识别带参数二维码、转发等功能
2019/07/20 Javascript
vue实现循环滚动列表
2020/06/30 Javascript
python实现对一个完整url进行分割的方法
2015/04/29 Python
详解Python3 对象组合zip()和回退方式*zip
2019/05/15 Python
详解DeBug Python神级工具PySnooper
2019/07/03 Python
Django实现微信小程序的登录验证功能并维护登录态
2019/07/04 Python
Django中的静态文件管理过程解析
2019/08/01 Python
40个你可能不知道的Python技巧附代码
2020/01/29 Python
Python实现王者荣耀自动刷金币的完整步骤
2021/01/22 Python
意大利团购网站:Groupon意大利
2016/10/11 全球购物
香港现代设计家具品牌:Ziinlife Furniture
2018/11/13 全球购物
Whistles官网:英国女装品牌
2020/08/14 全球购物
周年庆典主持词
2014/04/02 职场文书
商务专员岗位职责范本
2014/06/29 职场文书
孝老爱亲事迹材料
2014/12/24 职场文书
2016年心理学教育培训学习心得体会
2016/01/12 职场文书
oracle连接ODBC sqlserver数据源的详细步骤
2021/07/25 Oracle
PostgreSQL聚合函数介绍以及分组和排序
2022/04/12 PostgreSQL
以MySQL5.7为例了解一下执行计划
2022/04/13 MySQL