1

我有这个事件监听器:

input_1.addEventListener('input',function(){
    updateFromInput(1);
},false);

它控制滑块的位置。
现在,如果我想在输入中输入“100”,滑块将首先跳到“1”位置,然后跳到“10”,最后跳到“100”位置。
它很笨重,我想给它一种更自然的感觉。

虽然我现在阅读 JS 很自在,但我在编写它时仍然是个新手。

我了解这种类型的计时器所需的逻辑(如果计时器大于750 毫秒 updateFromInput),我只是有点模糊如何开始在 javascript 中编码。
当然,这种类型的计时器功能之前已经被同样多的开发人员完成了一百万次......只是努力寻找一两个例子:)

任何代码、链接或示例将不胜感激。

4

2 回答 2

2

通常的方法是设置一个计时器,如果你看到另一个按键,取消之前的计时器并设置一个新的,例如:

var timer = 0;
input_1.addEventListener('input',function(){
    maybeUpdateFromInput(1);
},false);

function maybeUpdateFromInput(val) {
    if (timer) {
        clearTimeout(timer);
    }
    timer = setTimeout(function() {
        updateFromInput(val);
        timer = 0;
    }, 50); // 50 = 50ms, you may want 75, 100, even 125
}

这将使更新延迟 50 毫秒(setTimeout调用中的值)。如果超过 50 毫秒没有看到输入,它将更新。

于 2012-06-28T14:43:53.953 回答
1

我认为处理这个问题的更好方法是同时按下键和按下键。这样,万一用户按住键,它就不会被误解。看看这个 jsFiddle:

http://jsfiddle.net/9c46B/3/

显然,您必须将其更改为添加事件侦听器(而不是 HTML 中的内联处理程序)。显然,您会将警报更改为您想要的任何内容。但希望这会有所帮助,并且是您正在寻找的!

于 2012-06-28T14:50:25.660 回答