javascript - 延迟 mousedown 间隔开始(JQuery/Javascript)

Question

我正在编写一个 jQuery 插件，它可以在按下按钮时操作输入字段的值。

到目前为止，我所拥有的是通过单击按钮来控制值的能力，以及在用户按住按钮时不断增加它的能力。简化后，脚本是这样的:

var element = $('#test-input');
var interval;

$('#test-up-button').on({
    mousedown : function(e) {
        element.val(parseInt(element.val()) + 1);

        //Wait 400ms, than do the interval

        interval = window.setInterval(function() {
            element.val(parseInt(element.val()) + 1);
        }, 200);      
        e.preventDefault();        
    },
    mouseup : function() {
        window.clearInterval(interval);
    }
});

(您还可以在此处查看工作版本:http://jsfiddle.net/Husar/Hxhsh/#base)

但是，正如您在评论中看到的那样，我还希望当 mousedown 事件发生时，在初始增加值之后，间隔函数延迟 400ms，然后才执行。

所以你按下按钮，值变为 + 1，你按住按钮一点，然后间隔开始滚动。

Answer 1

将 setInterval 包装在 setTimeout 中。并且，与 interval 一样，保留并清除 timeout 值:

var interval, timeout;

// ...

    timeout = window.setTimeout(function () {
        interval = window.setInterval(function() {
            element.val(parseInt(element.val()) + 1);
        }, 200);      
    }, 400);

// ...

    window.clearTimeout(timeout);
    window.clearInterval(interval);

http://jsfiddle.net/coiscir/jUSg8/