<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>

</head>
<body>

<input type="text">
<script>
    var inp = document.querySelector('input');
    inp.addEventListener('input',debounce(function(){
        console.log(this.value);
    },1000));
    /*
    函数防抖
    fn 要执行的函数
    delay 多长时间执行一次
    以1秒钟为例:在1秒钟内无论输入多少次只会在1秒钟最后的时刻执行一次
    应用场景:输入验证,滚动/放大窗口停止
    */
   function debounce(fn,delay){
       var timer=null;
       return function(){
            clearTimeout(timer);
           var _this=this;
           timer=setTimeout(function(){
                fn.call(_this);
           },delay);
           
       };
   };
</script>

</body>
</html>


kangting
62 声望3 粉丝

一只小小的前端