大佬教程收集整理的这篇文章主要介绍了如何使用jQuery/javascript将事件的处理限制为每X秒一次?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我已经在使用jQuery进行事件处理,所以基于jQuery的解决方案会更受欢迎,尽管vanilla javascript也很好.
> This jsfiddle显示按键快速点火,不受任何操作限制
> This jsfiddle使用setTimeout()实现在vanilla JS中将处理限制为每0.5秒一次
我的问题是
> jQuery有内置的方法吗?我在.on()docs中看不到任何内容
>如果没有,在我的second jsfiddle example中使用香草JS是否有更好的模式?
没有.
您可以跟踪上次调用处理程序的时间,而只是在定义的时间间隔过后调用它,而不是使用setTimeout和flags.这被称为限制,并且有各种方法来实现它.
在最简单的形式中,您只需忽略在lastCall间隔时间内进行的每个调用,以便每个间隔中只发生一次调用.
function throttle(func,interval) { var lastCall = 0; return function() { var Now = Date.Now(); if (lastCall + interval < Now) { lastCall = Now; return func.apply(this,arguments); } }; }
你可以用作
$("#inputField").on("keypress",throttle(function(event) { $("div#output").append("key pressed <br/>"); },500));
正如Esailija在0700年提到的那样,也许它不是你需要的限制,而是去抖动.这是一个类似但略有不同的概念.虽然限制意味着某些事情应该每x毫秒只发生一次,但是去抖动意味着只有在最后x毫秒内没有发生某些事情时才会发生.
典型的例子是滚动事件.将经常调用滚动事件处理程序,因为事件基本上是连续触发的.但也许你只想在用户停止滚动而不是滚动时执行处理程序.
实现此目的的一种简单方法是使用超时并在再次调用该函数时取消它(并且超时尚未运行):
function debounce(func,interval) { var lastCall = -1; return function() { clearTimeout(lastCall); var args = arguments; var self = this; lastCall = setTimeout(function() { func.apply(self,args); },interval); }; }
以上是大佬教程为你收集整理的如何使用jQuery/javascript将事件的处理限制为每X秒一次?全部内容,希望文章能够帮你解决如何使用jQuery/javascript将事件的处理限制为每X秒一次?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。