常用防止事件频繁点击的方法

在实际的开发过程中,我们经常会遇到一些频繁触发的事件,比如onmousemove、频繁的click事件等,下面总结两种个人常用的节流方法。

     第一种:规定固定时间内只能触发一次

   
var setTimer = function(){
        var timer,
        firstUse = true;
        return function(){
          if(firstUse){
            console.log(parseInt(Math.random()*100));
            return firstUse = false;
          }
          if(timer)return false;
          timer = setTimeout(function(){
            console.log(parseInt(Math.random()*100))
            clearTimeout(timer);
            timer = null;
          },500)
        }
      }
var getTimer = setTimer();
     第二种:前后两次事件触发间隔大于某时间段时才能触发

var setTimer = function(){ var timer = new Date().getTime(), nextTime, firstUse = true; return function(){ if(firstUse){ console.log(parseInt(Math.random()*100)); return firstUse = false; } nextTime = new Date().getTime(); if(nextTime - timer < 500){ timer = nextTime; return false; } console.log(parseInt(Math.random()*100)); timer = nextTime; } } var getTimer = setTimer();

由于只是对于两种方法的说明,并且是上班时间(逃),所以代码有很多不足之处,比如参数的传递等,这里不赘述

除了以上两种外还有许多方法可以实现,比如不需要触发时使用unbind来解绑事件等,同样不再赘述




你可能感兴趣的:(js常见问题总结)