javascript - 检查按钮是否在时间内被点击

Question

这是我想做的:

1. 用户点击按钮，运行函数A
2. 如果在 1 秒内没有再次点击按钮，也运行功能 B
3. 如果按钮已被点击，重复(再次运行函数 A 并检查函数 B)

这是我试过的

var clicked = false;

$('#button').click(function(){
    A();
}); 

function A(){
    clicked = true;
    setTimeout(function(){
         clicked == false;
    )}, 1000);

    setTimeout(function(){
        if ( clicked == false ) {
            B();
        }
    )}, 1000);
}

我认为代码适用于场景 1 和 2，但我怎样才能让它也适用于 3？

编辑:刚刚看到一个相关的SO question发布后我没有通过搜索找到。请稍等，我正在检查它是否重复

Answer 1

我认为您正在寻求限制(缓冲)点击，也就是说，您希望在执行操作之前等待指定的时间，如果在您的限制时间内再次发生相同的事件，您将重新开始等待。 http://jsfiddle.net/8QdLV/

function B() {
    console.log('Clicked')
}
var timeoutId;
$('#button').click(function() {
    clearTimeout(timeoutId);
    timeOutId = setTimeout(B, 1000);
});

这可以推广http://jsfiddle.net/8QdLV/

function throttle(handler, buffer) {
    var timeoutId;
    buffer = buffer || 1000;
    return function(e) {
        clearTimeout(timeoutId);
        var me = this;
        timeoutId = setTimeout(function() {
            handler.call(me, e);
        }, buffer);
    }
}

$('button').click(throttle(function() {
    console.log('Throttled click');
});  

顺便说一句，你可能想使用 https://code.google.com/p/jquery-debounce/它还提供了一个$.throttle 函数