Question

我希望每当发生重复事件时触发一个动作（如“更新已保存！”消息）（点击“保存”按钮）但不会在给定时间内触发两次。

对于以下内容，我希望excecuteFunction（）每3秒最多触发一次，但如果在4.5秒后清除setInterval，我仍然希望它在6秒后再次触发。< / p>

var minimumTime = 3000; // minimum ms between events
function myTimedEvent() {
    if ( lessThanMinimumTime() )
        // loop through again
    else {
        executeFunction();
    }
}
window.setInterval(myTimedEvent, 500);

executeFunction()可以在执行时创建时间戳，lessThanMinimumTime()可以将该时间戳与当前时间进行比较，然后设置一个子间隔，如果它在最小值内，则由executeFunction()清除时间范围。

必须有更好的方法。

Answer 1

这将每三秒触发一次事件（加上执行executeFunction（）所需的时间），但如果事件在最后三秒内触发，仍然会调用executeFunction（）。这是你在找什么？

var minimumTime = 3000; // minimum ms between events
var lastFired = null;
var timer;
function myEventHandler(){
    var now = new Date().getTime();
    clearTimeout(timer);
    if(lessThanMinimumTime()){
        timer = setTimeout(myEventHandler, lastFired - now + minimumTime);
    } else {
        executeFunction();
        lastFired = now;
    }
}

function lessThanMinimumTime(){
    if(lastFired == null) return false;
    return lastFired > new Date().getTime() - minimumTime;
}

Answer 2

试试这个：

Function.prototype.restrictCallsToInterval = function(sec){
    var self = this,
        last, queued, diff;

    return function(){
        var args = arguments;
        if(last && !queued && (diff = (new Date().getTime() - last + 1000*sec)) > 0){
            // queue this up
            queued = setTimeout(function(){
                self.apply(self, args);
            }, diff);

            return;
        }

        last = new Date().getTime();
        self.apply(self, args);
    }
};

function doSomething(x){
    console.log(x);
}

doSomething = doSomething.restrictCallsToInterval(3);
doSomething(22);
doSomething(23);

Answer 3

嗯，你问过“更好的方式” - 我认为没有任何更好的方式，但这是我能想到的最简单的方法：

var minimumTime = 3000; // minimum ms between events
var canFireEvent = true;
function myTimedEvent() {
    if (canFireEvent) {
        canFireEvent = false;
        window.setTimeout(function() {
            canFireEvent = true;
        }, minimumTime);
        executeFunction();
    }
}

使用一个布尔标志。没有弄乱日期。

Proof of concept。
（虽然定时器间隔为1秒，但每3秒执行一次功能）

以最小间隔触发javascript事件

3 个答案: