<!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>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。