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 });

ログイン後にコピー

魔法のアップグレード

いわゆるマジックアップグレードとは、実際には、プログラム全体のすべてのカスタムイベントを自動的に登録して jQuery にバインドし、実行すると、そのイベントを登録するすべてのモジュールが実行されることを意味します。たとえば、モジュール User.js で定義された User

Update メソッド

と、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);
        });
      })

ログイン後にコピー

次に、各 js モジュール

installation によって定義されるコードは次の形式になります:

    User= {
      AddComplete: function(e, data) {
//...
      },
      UpdateComplete: function(e, data) {
//...
      }
    }

ログイン後にコピー

こうして、どこにいても、必要に応じて、jQuery を使用してイベントをトリガーできます:

$(document).trigger("UpdateComplete", data);

ログイン後にコピー

このメソッドを通じて、モジュールのメソッドが 1 つのイベントのみを登録できることがわかります。 1 つのメソッドを使用して複数のイベントトリガーを登録するには、次のメソッドを使用できます:

    var blogController = {
      blogAddOrUpdateComplete: function() {
//...
      }
    }
    blogController.blogAddComplete = blogController.blogUpdateComplete = blogController.blogAddOrUpdateComplete;

ログイン後にコピー

最後の注意: この記事では、単純な例のみを示しています。異なるモジュール、たとえば、User.js の AddComplete と Blog.js の AddComplete はまったく関連していない可能性があります。つまり、現時点では、このイベントは一律に処理されるべきではありません。ただし、検出対象が同じであれば、User モジュールはアカウントを無効にした後の操作を処理する必要があり、Blog モジュールも必要な場合があるため、汎用的に使用できる DisableUserComplete などを使用できます。アカウントを無効にした後の操作を処理します。

結論

おじさんのメモ: 日々の業務における様々なヒントや資料（テクノロジーを含みますが、これに限定されません）を記録することを目的としています。役に立った場合は、おじさんに書く動機を与えるために推奨してください。

以上がjQuery のカスタムバインディングに関する簡単な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。