在 debounce 方法执行之前 jQuery 调用动画
Posted
技术标签:
【中文标题】在 debounce 方法执行之前 jQuery 调用动画【英文标题】:jQuery call animation before debounce method executes 【发布时间】:2021-06-06 08:30:09 【问题描述】:我有一段代码如下:
$('.cardButton').click($.debounce(1500, function ()
console.log("OK");
));
这种情况下的去抖动效果非常好..
但是 - 我需要添加动画功能,它将在去抖动发生之前替换“.cardButton”元素...
做这样的事情:
$('.cardButton').click($.debounce(1500, function ()
StartAnimationLoader();
console.log("OK");
));
// In this case - animation starts as soon as console writes out "OK" ...
或者像下面这样:
$('.cardButton').click(function()
StartAnimationLoader();
$.debounce(1500, function ()
console.log("OK");
)
);
// When I execute code like this - there is nothing written in the console... - thus this method doesn't works
我需要在去抖动发生之前执行动画...
我在这里做错了什么?
有人可以帮帮我吗?
【问题讨论】:
有人吗? =) 给我们几分钟的时间来解决您的问题! :) 你可以添加第二个事件$('.cardButton').click($.debounce... );
$(".cardButton").click(() => StartAnimationloader());
@freedomn-m 是这段单独的代码吗? o.o
@freedomn-m sec 现在尝试
【参考方案1】:
向同一个元素添加第二个(或更多)事件处理程序将触发两个事件(除非已停止),因此您可以通过使用两个单独的事件处理程序来创建两个操作:
// existing debounce fire only after user stops clicking
$('.cardButton').click($.debounce... );
// additional event will fire on every click
$(".cardButton").click(function() StartAnimationloader() );
【讨论】:
以上是关于在 debounce 方法执行之前 jQuery 调用动画的主要内容,如果未能解决你的问题,请参考以下文章
lodash入门,使用 。throttle和debounce
43.Vue中使用Lodash 节流(throttle)和防抖(debounce)函数