两种函数截流方法

  当我们按下一个按钮触发了事件的时候，为了减少不必要的错误，希望这个按钮上的业务执行完毕再能再次被点击，函数截流就是 ，阻止业务期间又触发的事件

 

第一种函数截流方法

var lock =true;
oDiv.onclick = function() {
  if(!lock) return;
  lock = false;
  setTimeout(function(){
       lock = true;   
      },3000)      
}

第二种函数截流方法

  <input type="text" id="search">
  <script>
    function throttle(fn, delay, context) {// fn 是要执行的函数  delay 是延时   context 是指调用函数中this是谁，可选
      context = context || null;
      clearInterval(fn.timeoutId);
      fn.timeoutId = setTimeout(() => {
        fn.call(context);
      }, delay);
    }
    
    function queryData() {
      console.log('搜索' + this.value);
    }

    var oInput = document.querySelector('#search')
    oInput.onkeyup = function() {
      throttle(queryData, 500, this);
    }  

   <script>