[解決済み] 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() やその他の関連関数を使用する以外の方法でバインドされているイベントリスナーの前にトリガーされるとは限りません。
関連
-
[解決済み】 `string.split is not a function` というエラーの原因は何ですか?
-
OSSアップロードエラーを解決する: net::ERR_SSL_PROTOCOL_ERROR
-
jq は html ページとデータを動的に分割する。
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
vueのプロジェクトでモックを使用する方法を知っていますか?
-
Vueの一般的な組み込みディレクティブの説明
-
[解決済み】最大呼び出しスタックサイズ超過エラー
-
[解決済み】Node Version Manager のインストール - nvm コマンドが見つかりません。
-
[解決済み】リソースの読み込みに失敗した:Bind関数でサーバーが500(Internal Server Error)のステータスで応答した【非公開
-
[解決済み】React - TypeError: 未定義のプロパティ 'props' を読み取ることができない。
-
[解決済み】 `string.split is not a function` というエラーの原因は何ですか?
-
[解決済み】ReactJSでエラー発生 Uncaught TypeError: Super expression は null か関数でなければならず、undefined ではありません。
-
jq は html ページとデータを動的に分割する。
-
[解決済み] jQueryのイベントハンドラは、常にバインドされた順に実行されます - これを回避する方法はありますか?重複