拖动resize句柄时，javascriptresize事件多次触发
我希望这个jQuery插件可以工作，但它没有：
http://andowebsit.es/blog/noteslog.com/post/how-to-fix-the-resize-event-in-ie （旧链接为noteslog.com/post/how-to-fix-the-resize -event-in-ie）。
我在他的网站上添加了评论，但他们已经过审核，所以你可能还没有看到它。
但无论如何，让我解释一下我的愿望。 我想要在用户暂停resize和/或完成resize时触发“resize”类型的事件，而不是在用户主动拖动浏览器的窗口resize句柄时触发。 我有一个相当复杂和耗时的OnResizeHandled函数，我需要运行，但不会运行100次因为用户将窗口加宽了100px并且事件被激活了所有移动像素。 我想最好的选择是在用户完成resize后处理它。
借用并发解决方案中的一些想法来管理来自浏览器的大量事件。
例如，当您第一次收到resize事件时，将标志设置为true表示用户当前正在resize。 设置超时以在1秒后调用实际的resize事件处理程序。 然后，只要此标志为true，就忽略resize事件。 然后，在实际的处理程序中，一旦完成所有操作并将其更正，请将标志设置为false。
这样，您每秒只能处理一次最新事件（或根据您的要求在某个其他时间段内处理）。 如果用户在resize的过程中暂停，则会处理。 如果用户完成，它将处理。
这可能不适合您，但还有许多其他方法可以使用更有帮助的锁。
这样的代码怎么样：
function resizeStuff() { //Time consuming resize stuff here } var TO = false; $(window).resize(function(){ if(TO !== false) clearTimeout(TO); TO = setTimeout(resizeStuff, 200); //200 is time in miliseconds }); 这应该确保该function仅在用户停止resize时resize。
Paul Irish有一个很棒的Debounced jQuery插件可以解决这个问题。
如果你进入图书馆，你应该检查下划线，下划线已经处理了你的需要，你可能会在你的项目中有更多。
这是下划线debouncer如何工作的一个例子：
// declare Listener function var debouncerListener = _.debounce( function(e) { // all the actions you need to happen when this event fires }, 300 ); // the amount of milliseconds that you want to wait before this function is called again
然后在调整窗口大小时调用debouncer函数
window.addEventListener("resize", debouncerListener, false);
检查这里提供的所有下划线functionhttp://underscorejs.org/
如何在用户暂停resize时设置超时？ 在resize时重置超时，或者在超时到期时触发resize事件处理程序。
既然它是用jQuery构建的，你不能将某种onComplete事件绑定到扩展名并传递一个应该在被调用时执行的函数吗？
编辑：
当用户开始调整窗口大小时，请设置监视窗口尺寸的间隔。 如果尺寸未在规格的预设时间段内更改，则可以将窗口调整为“已完成”。 你在这里选择的javascript函数是setInterval（），它接受两个参数 – 一个调用每个tick的函数，以及每个tick以毫秒为单位的时间。
至于如何在jquery框架中专门编写，好吧，我不太了解jquery能告诉你的那些。 也许其他人可以更具体地帮助您，但同时您可以考虑扩展已经链接的jquery扩展，其中onComplete事件就像我刚才描述的那样工作。
几天前我扩展了-event-handler的默认jQuery。 如果在给定间隔内未触发事件，它会将一个或多个事件的事件处理函数附加到所选元素。 如果您只想在延迟之后触发回调（例如resize事件），则此function非常有用。 https://github.com/yckart/jquery.unevent.js
;(function ($) { var methods = { on: $.fn.on, bind: $.fn.bind }; $.each(methods, function(k){ $.fn[k] = function () { var args = [].slice.call(arguments), delay = args.pop(), fn = args.pop(), timer; args.push(function () { var self = this, arg = arguments; clearTimeout(timer); timer = setTimeout(function(){ fn.apply(self, [].slice.call(arg)); }, delay); }); return methods[k].apply(this, isNaN(delay) ? arguments : args); }; }); }(jQuery));
像任何其他on或bind -event处理程序一样使用它，除了你可以传递一个额外的参数作为最后一个：
$(window).on('resize', function(e) { console.log(e.type + '-event was 200ms not triggered'); }, 200);