如何对与 jQuery 绑定的事件进行排序 [英] How to order events bound with jQuery

问题描述

假设我有一个 Web 应用程序，它的页面可能包含 4 个脚本块 - 我编写的脚本可以在其中一个块中找到，但我不知道哪个由控制器处理.

Lets say I have a web app which has a page that may contain 4 script blocks - the script I write may be found in one of those blocks, but I do not know which one, that is handled by the controller.

我将一些 onclick 事件绑定到一个按钮，但我发现它们有时会以我没想到的顺序执行.

I bind some onclick events to a button, but I find that they sometimes execute in an order I did not expect.

有没有办法保证秩序，或者你过去是如何处理这个问题的?

Is there a way to ensure order, or how have you handled this problem in the past?

推荐答案

我多年来一直试图概括这种过程，但就我而言，我只关心链中第一个事件侦听器的顺序.

I had been trying for ages to generalize this kind of process, but in my case I was only concerned with the order of first event listener in the chain.

如果它有任何用处，这里是我的 jQuery 插件，它绑定了一个事件侦听器，该侦听器总是在任何其他事件之前触发:

If it's of any use, here is my jQuery plugin that binds an event listener that is always triggered before any others:

** 内嵌 jQuery 更改(感谢 Toskan) **

(function($) {
    $.fn.bindFirst = function(/*String*/ eventType, /*[Object])*/ eventData, /*Function*/ handler) {
        var indexOfDot = eventType.indexOf(".");
        var eventNameSpace = indexOfDot > 0 ? eventType.substring(indexOfDot) : "";

        eventType = indexOfDot > 0 ? eventType.substring(0, indexOfDot) : eventType;
        handler = handler == undefined ? eventData : handler;
        eventData = typeof eventData == "function" ? {} : eventData;

        return this.each(function() {
            var $this = $(this);
            var currentAttrListener = this["on" + eventType];

            if (currentAttrListener) {
                $this.bind(eventType, function(e) {
                    return currentAttrListener(e.originalEvent); 
                });

                this["on" + eventType] = null;
            }

            $this.bind(eventType + eventNameSpace, eventData, handler);

            var allEvents = $this.data("events") || $._data($this[0], "events");
            var typeEvents = allEvents[eventType];
            var newEvent = typeEvents.pop();
            typeEvents.unshift(newEvent);
        });
    };
})(jQuery);

注意事项:

• 这还没有经过全面测试.
• 它依赖于 jQuery 框架的内部结构不变(仅在 1.5.2 中测试).
• 它不一定会在以任何方式绑定的事件侦听器之前触发，除了作为源元素的属性或使用 jQuery bind() 和其他相关函数.

这篇关于如何对与 jQuery 绑定的事件进行排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！