ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery のカスタム バインディングに関する簡単な説明
まず、jQuery のカスタム バインディングの使用方法を見てみましょう。bind または live を使用して event をサブスクライブできます (もちろん、1.7 以降でも使用できます)。次のようにコーディングします。
$("#myElement").bind('customEventName',function(e){ ... }); $(".elementsClass").live('customEventName',function(e){ ... });
次に、次のようにイベントをトリガーします:
$("#myelement").trigger('customEventName');
または、カスタム イベントに追加のパラメーターを追加することもできます。たとえば:
$("#myelement").bind('customEventName',function(e,data){ if(data.custom) ... }); $("#myelement").trigger('customEventName',{ custom: false });
魔法のアップグレード
と、Blogs.js で定義された BlogUpdate メソッド は、両方ともブログを公開するときに実行する必要がある関数 関数 を定義し、全体で統一されたイベント名を登録できます。プロセス (例: BlogAdded) を jQuery で指定されたコンテナ (例: document) にバインドし、ブログの公開に成功した後、$(document).trigger("BlodAdded") を実行すればOKです。
以下に一般的なサンプル コードを示します:var components = [User, Blog, Group, Friend, Topic, Photo]; var eventTypes = ["AddComplete", "UpdateComplete", "DeleteComplete", "LockComplete", "UnLockComplete"]; $.each(components, function(i,component) { $.each(eventTypes, function(i,eventType) { var handler = component[eventType]; if (handler) $(document).bind(eventType, handler); }); })
installation によって定義されるコードは次の形式になります:
User= { AddComplete: function(e, data) { //... }, UpdateComplete: function(e, data) { //... } }
こうして、どこにいても、必要に応じて、jQuery を使用してイベントをトリガーできます:
$(document).trigger("UpdateComplete", data);
var blogController = { blogAddOrUpdateComplete: function() { //... } } blogController.blogAddComplete = blogController.blogUpdateComplete = blogController.blogAddOrUpdateComplete;
最後の注意: この記事では、単純な例のみを示しています。異なるモジュール、たとえば、User.js の AddComplete と Blog.js の AddComplete はまったく関連していない可能性があります。つまり、現時点では、このイベントは一律に処理されるべきではありません。ただし、検出対象が同じであれば、User モジュールはアカウントを無効にした後の操作を処理する必要があり、Blog モジュールも必要な場合があるため、汎用的に使用できる DisableUserComplete などを使用できます。アカウントを無効にした後の操作を処理します。
結論おじさんのメモ: 日々の業務における様々なヒントや資料(テクノロジーを含みますが、これに限定されません)を記録することを目的としています。 役に立った場合は、おじさんに書く動機を与えるために推奨してください。
以上がjQuery のカスタム バインディングに関する簡単な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。