在可以再次调用javascript函数之前等待

Wait before a javascript function can be called again

本文关键字：函数 等待 javascript 调用      更新时间：2023-09-26

我看过许多不同的解决方案，没有一个是有效的。我知道它与setTimeout有关，但我不知道如何正确地实现它。

function myfunction()
{
//the function
//wait for 1 second before it can be ran again
}

澄清一下:我不想以固定的时间间隔调用函数，我希望能够在再次调用函数之前强制执行延迟

var lastTime = 0;
function myFunction() {
    var now = new Date().getTime(); // Time in milliseconds
    if (now - lasttime < 1000) {
        return;
    } else {
        lastTime = now;
    }
    // rest of function
}

根本不需要使用setTimeout。下面的答案与其他答案类似，但使用闭包来记住函数的最后一次运行时间，而不是全局变量。

var myFunction = function() {
  var lastTime = new Date();
  return function() {
    var now = new Date();
    if ((now - lastTime) < 1000) return;
    lastTime = now; 
    /* do stuff */
  };
}());

我认为最简单的解决方案是保持boolean变量并在给定delay后将其重置为true。

<标题>小提琴h1> 

<button id="clickme">click me!</button>
JavaScript

var canGo = true,
    delay = 1000; // one second
var myFunction = function () {
    if (canGo) {
        canGo = false;
        // do whatever you want
        alert("Hi!");
        setTimeout(function () {
            canGo = true;
        }, delay)
    } else {
        alert("Can't go!");
    }
}

$("#clickme").click(function(){
    myFunction();
})

这样，您将持有一个布尔值canGo，并将其设置为true。如果运行该函数，则将canGo设置为false，并将setTimeout()设置为delay时间段(以毫秒为单位)。如果您尝试再次运行该函数，它将不再运行，而是运行alert("Can't go!")。这只是为了演示;你不需要那部分。在delay之后，canGo将被设置为true，您将能够再次运行该函数。

var lastRan = 0;
var myFunction = function() {
  var now = Date.now();
  if(now-lastRan < 1000) {
      return;
  }
  lastRan = now;
  //rest of function
};

你可以使用throttle或debounce from underscore.js

http://underscorejs.org/节流

throttle_。节流阀(功能，等待，[选项])

创建并返回a传入函数的新节流版本，当调用时重复，实际上只会调用原始函数最多一次每等待一毫秒。用于速率限制事件发生得比你能跟上的快。

默认情况下，只要调用该函数，throttle就会执行该函数第一次，如果你再叫它几次在等待期，等等待期一结束。如果你愿意要禁用前置调用，请传递{leading: false}，如果您想想要禁用尾部执行，传递{trailing:假}。

var throttled = _.throttle(updatePosition, 100);
$(window).scroll(throttled);

http://underscorejs.org/防反跳

debounce_debounce (function, wait， [immediate])

创建并返回a传递的函数的新版本将推迟其执行直到自上次执行以来已经过了等待毫秒是时候调用它了。用于实现只应该的行为在输入停止到达后发生。例如:渲染预览Markdown注释，在窗口后重新计算布局已停止调整大小，等等

为immediate参数传递true，以使debounce触发功能上的领先，而不是后缘的等待时间间隔。在防止意外事故等情况下很有用第二次双击"提交"按钮。

var lazyLayout = _.debounce(calculateLayout, 300);
$(window).resize(lazyLayout);

如果你只是想在设定的时间后再次运行函数，你可以使用setTimeout并将要运行的函数和延迟时间(以毫秒为单位)传递给它。

function myfunction() {
    //the function
    //run again in one second
    setTimeout(myfunction, 1000);
}

根据发布者评论编辑:

var waiting = false;
var myfunction = function() {
    if (!waiting) {
        //Run some code
        waiting = setTimeout(function() {
            waiting = false;
        }, 1000);
    }
};
相关文章：