Question

由于'changeCursor'事件（我正在使用ACE编辑器），我的一个脚本在某个时刻调用了一个函数。当我多次按下时，这会减慢光标的移动速度。

我真的希望调用这个函数，但如果只在我的光标停止移动时调用它（即我不需要看到中间状态），它就没问题了。

是否有标准方法可以忽略除最后一个事件之外的所有事件？

Answer 1

经典的方法是使用短暂的超时：

var cursorTimer;
function changeCursor() {
    clearTimeout(cursorTimer);
    cursorTimer = setTimeout(function() {
        // process the actual cursor change here
    }, 500);

}

您的常规代码可以在每次更改时继续调用changeCursor()（就像现在一样），但setTimeout()中的实际代码只会在最后一次没有发生游标更改事件时执行500毫秒。您可以根据需要调整该时间值。

知道事件已经停止的唯一方法是等待一段短时间并且检测不到进一步的移动（这就是这样做）。通常在滚动事件中使用类似的逻辑。

Answer 2

这个问题可能有点过头了，但是看看RxJS：http://reactive-extensions.github.com/RxJS/#What是RxJS吗？

它添加了一些非常强大的方法来“查询/操纵”JavaScript中的事件流。 https://github.com/Reactive-Extensions/RxJS/wiki/Observable

在这种情况下，“油门”方法就是您的追求。下面是一个使用Throttle和keyup事件创建维基百科匹配自动完成的示例。 https://github.com/Reactive-Extensions/RxJS-Examples/blob/master/autocomplete/autocomplete.js

// Get all distinct key up events from the input and only fire if long enough and distinct
var keyup = Rx.Observable.fromEvent(input, 'keyup').select(function (e) {
    return e.target.value; // Project the text from the input
})
.where(function (text) {
    return text.length > 2; // Only if the text is longer than 2 characters
})
.throttle(
    750 // Pause for 750ms
)
.distinctUntilChanged(); // Only if the value has changed

如何忽略除了一系列快速Javascript事件的最后一个之外的所有事件？

2 个答案: