检查按钮“并没有”被点击了一定的时间内(jQuery的)(Check if a button “ha

2019-10-17 04:00发布

基本上:

你点击一个按钮,它运行功能1。
如果你没有在1秒内再次单击该按钮,然后功能2点运行。
如果你点击在1秒内的按钮,然后再次运行功能1。
等等等等...

我想不出在JavaScript中执行此逻辑。

有没有连的方法吗?

提前致谢!

Answer 1:

从我的头顶(没有测试,但是这似乎大多数逻辑给我):

var t = null;

$("button").click(function() {
    console.log("this is function 1");
    if (t !== null) { window.clearTimeout(t); }

    t = window.setTimeout(function() {
        console.log("and this is function 2");
    }, 1000);
});


Answer 2:

你要使用计时器来跟踪时间。 您可以使用setTimeout在1秒(1000毫秒)运行功能2。 但是,如果你再次点击按钮,你应该停止计时器。 你可以这样做,使用clearTimeout

核心线将是:

var timer;

// in button's click handler:
clearTimeout(timer);
timer = setTimeout(function2, 1000);


Answer 3:

这应该这样做:

(function() {
    var timer = null;

    $('#button').on('click', function() {
        function1();                         // always call function1
        clearTimeout(timer);                 // clear the timer
        timer = setTimeout(function2, 1000); // run function2 1s later
    });
})();

见http://jsfiddle.net/alnitak/QZRTA/

外部功能块用来保持timer在局部范围内的变量,而无需创建一个全局变量。



Answer 4:

使用setTimeoutclearTimeout

var t = null;
var timeoutMs = 1000; // in ms

$("#btn1").click(function (){
    func1();
    if (t !== null)
        clearTimeout(t);    
    t = setTimeout(func2, timeoutMs);
});


Answer 5:

$('button').click(function() {
    console.log('Func 1');
    clearTimeout($(this).data('throttle'));
    $(this).data('throttle', setTimeout(function() {
        console.log('Func 2');
    }, 1000));
});​

http://jsfiddle.net/dfsq/rrXWt/



文章来源: Check if a button “hasn't” been clicked within a certain amount of time (jQuery)