JS实现禁止短时间内连续触发事件

Posted 2020-09-28

设置定时器，每次进入函数时先清空定时器，然后在执行

  let c =null;
  let dom = document.querySelector(‘#me‘);
  dom.addEventListener(‘click‘,function(){
    clearTimeout(c);
    c = setTimeout(function(){
      console.log(2000)
    },1000)
  },false)

如果是一个按钮的话，可以使用一下方法

1       var clickflag = 0;  
2        $(‘.btn‘).click(function () {  
3                 if (clickflag == 0) {  
4                     clickflag = 1;  
5                     $(this).addClass("c_gray");  
6                     setTimeout(function () { clickflag = 0 }, 1000);  
7                 }  
8             });  

同时按钮事件也可以使用添加属性的方法来解决连续触发

1 $("#btn").attr("disabled", "disabled");  //使按钮不能被点击 
2 $("#btn").attr("value", "wait");              //更改按钮上的文字 
3 
4 $("#btn").removeAttr("disabled");       //使按钮能够被点击 
5 $("#btn").attr("value", "点我");            //更改按钮上的文字