javascript - 如何在 jQuery 中中断以前的事件触发器

Question

所以我有一个滚动事件。它做了很多事情来确定是否应该在页面上移动某些东西。当您向下滚动时，它会触发。如果你向下滚动，拖动，它会燃烧无数次。正如您所料，也许。这里有一些简单的虚拟代码来表示事件的顺序。

function scroller() {
    // 1. A really expensive calculation that depends on the scroll position
    // 2. Another expensive calculation to work out where should be now
    // 3. Stop current animations
    // 4. Animate an object to new position based on 1 and 2
}
$(window).on('resize' scroller);

不要误会我的意思，它通常准确，所以并发问题不多。我的动画 在 事件调用 .stop()(作为第 3 部分)所以最新版本总是*正确的版本，但它占用了大量 CPU。我想在这里成为一名负责任的开发人员，而不是期望每个用户都拥有四核 i7。

那么对于我的问题... 我可以取消之前从特定事件处理程序调用我的方法吗？有什么方法可以干扰这个排队/并行运行的“进程”堆栈"所以当一个新的被添加到堆栈时，旧的立即终止？我敢肯定有一种并发意识的措辞方式，但我想不出。

_{*至少我认为是这种情况 - 如果计算在较早的运行中花费了更长的时间，他们的动画可能是最后一个被调用的动画并且可能导致整个运行停止!唔。在想到这里之前，我没有考虑过这一点。立即停止先前迭代的另一个原因!}

Answer 1

您可以确保事件最多每 x 毫秒触发一次。例如:

(function ($) {
    $.fn.delayEvent = function (event, callback, ms) {
        var whichjQuery = parseFloat($().jquery, 10)
            , bindMethod = whichjQuery > 1.7 ? "on" : "bind"
            , timer = 0;
        $(this)[bindMethod](event, function (event) {                   
            clearTimeout (timer);
            timer = setTimeout($.proxy(callback, this, event), ms);
        });
        return $(this);
    };
})(jQuery);

$(window).delayEvent("resize", scroller, 1000);

简约演示: http://jsfiddle.net/karim79/z2Qhz/6/