如何在多次触发事件时只执行一次?(函数防抖)

如何让滚轮滑动一次只执行一次事件。

同样的问题,就是窗口多次调整后只允许触发一次事件,且延迟一段时间执行,如何解决。

只需要在事件开头加上clearTimeout即可,每次滑动时都清除排队执行的前面等候事件,以最后一次添加的事件为主。

var scrollEle = document.getElementById("inner");
var time;
var data;

scrollEle.onmousewheel = function(e)
{
clearTimeout(time);
time = setTimeout(function()
{
if(e.wheelDelta > 0)
{
if(scrollEle.scrollTop >= 400)
{
data = 0;
(function move()
{
data++;
scrollEle.scrollTop-=20;
if(data < 20)
{
setTimeout(move,16);
}
})();
}
}
else
{
if(scrollEle.scrollTop <= 800)
{
data = 0;
(function move()
{
data++;
scrollEle.scrollTop+=20;
if(data < 20)
{
setTimeout(move,16);
}
})();
}
}
},300);
e.preventDefault();
};

 

函数节流与函数防抖的分析: https://juejin.im/entry/58c0379e44d9040068dc952f

转载于:https://www.cnblogs.com/cheeseCatMiao/p/7867072.html

你可能感兴趣的:(如何在多次触发事件时只执行一次?(函数防抖))