1. ホーム
  2. javascript

[解決済み] jQueryで束縛されたイベントを順番に処理する方法

2022-04-24 08:39:51

質問

私が書いたスクリプトは、これらのブロックの1つに含まれているかもしれませんが、どれがコントローラによって処理されるかはわかりません。

私は、いくつかの onclick イベントがボタンに実行されますが、予期しない順序で実行されることがあります。

順番を確保する方法はありますか?また、過去にこの問題にどう対処しましたか?

解決方法は?

このような処理を一般化しようと何年も前から試みていたのですが、私の場合、チェーン内の最初のイベントリスナーの順番にしかこだわりがなかったのです。

イベントリスナーをバインドして、常に他のイベントより先にトリガーされるようにするjQueryプラグインです。

** jQueryの変更に合わせてUPDATEしました。 **

(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() やその他の関連関数を使用する以外の方法でバインドされているイベントリスナーの前にトリガーされるとは限りません。