运行javascript函数,但不要让它在x秒内重新运行

Run javascript function but then don't allow it to rerun for x seconds

本文关键字:重新运行 函数 javascript 运行      更新时间:2023-09-26

如何立即运行javascript函数,但不允许该函数再次运行x秒?

下面的代码确实添加了延迟,但它随后会多次触发函数disableKeyboardDateinputTest。

function disableKeyboardDateinputTimer() {
  setTimeout(function(){
    disableKeyboardDateinputTest();
  }, 1000);
}
disableKeyboardDateinputTest();
window.addEventListener('resize', disableKeyboardDateinputTimer);

防止函数被过多调用通常被称为'throttling'。lodash(和underscore)库有一个节流函数https://lodash.com/docs/4.16.1#throttle。你可以这样使用:

function functionToThrottle() {
  //...
  console.log('Called');
}
var x = 10; // seconds
var throttledFunction = _.throttle(functionToThrottle, x * 1000);
for (var i = 0; i < 10; i++) {
  throttledFunction();
}

您需要考虑是否需要前置呼叫(第一个呼叫立即发生)和/或尾随呼叫(如果在节流期间发生任何呼叫,则在周期结束时将发生单个呼叫)。

这里有一篇关于这个主题的好文章:https://css-tricks.com/debouncing-throttling-explained-examples/

如果你愿意使用Lodash,你可以使用它的throttle助手。

创建一个节流函数,每隔等待毫秒最多只调用一次func。