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

本文实例讲述了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相关内容感兴趣的读者可查看本站专题：《ECMAScript6(ES6)入门教程》、《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript错误与调试技巧总结》及《JavaScript数学运算用法总结》

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

您可能感兴趣的文章:

• ES6中Array.find()和findIndex()函数的用法详解
• JavaScript学习笔记之ES6数组方法
• JavaScript ES6中export、import与export default的用法和区别
• 详解JavaScript ES6中的模板字符串
• JavaScript中ES6 Babel正确安装过程
• ES6中Array.includes()函数的用法
• JavaScript ES6中CLASS的使用详解
• js实现把时间戳转换为yyyy-MM-dd hh:mm 格式(es6语法)
• 详解ES6之async+await 同步/异步方案
• ES5 ES6中Array对象去除重复项的方法总结
• 跟我学习javascript的最新标准ES6
• 深入理解React中es6创建组件this的方法
• 详解webpack 配合babel 将es6转成es5 超简单实例
• 让nodeJS支持ES6的词法----babel的安装和使用方法
• 手把手教你搭建ES6的开发运行环境
• 详解webpack+es6+angular1.x项目构建
• ES6新特性之模块Module用法详解
• JavaScript ES6常用基础知识总结