1

我正在编写一个 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 事件发生时，在初始增加值后，将间隔函数延迟 400 毫秒，然后才执行。

因此，您按下按钮，值变为 + 1，您按住按钮一点，然后间隔开始滚动。

4

3 回答 3

6

包裹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/

于 2012-04-01T20:36:02.580 回答
2

给你：http: //jsfiddle.net/Hxhsh/10/ :)

只需添加一个 setTimeout

于 2012-04-01T20:33:02.050 回答
1

只需使用 setTimeout来延迟 setInterval

mousedown: function(e) {
    setTimeout(function() {
        interval = window.setInterval(function() {
            element.val(parseInt(element.val()) + 1);
        }, 200);
    }, 400);
    e.preventDefault();
},
mouseup: function() {
    window.clearTimeout(timeout);
    window.clearInterval(interval);
}
于 2012-04-01T20:32:59.803 回答