Eine kurze Diskussion über die benutzerdefinierte Bindung von jQuery

jqueryBenutzerdefinierte Bindung

Lassen Sie uns zunächst einen Blick darauf werfen, wie Sie die benutzerdefinierte Bindung von jQuery verwenden. Sie können bind oder live verwenden, um ein Ereignis zu abonnieren Natürlich kann on auch nach 1.7 verwendet werden), der Code lautet wie folgt:

$("#myElement").bind('customEventName',function(e){ ... });
$(".elementsClass").live('customEventName',function(e){ ... });

Dann lösen Sie das Ereignis im aus Gehen Sie folgendermaßen vor:

$("#myelement").trigger('customEventName');

Oder Sie können dem benutzerdefinierten Ereignis zusätzliche Parameter hinzufügen, zum Beispiel:

$("#myelement").bind('customEventName',function(e,data){ if(data.custom) ... });
$("#myelement").trigger('customEventName',{ custom: false });

Magisches Upgrade

Das sogenannte Magic-Upgrade bedeutet eigentlich, dass alle benutzerdefinierten Ereignisse im gesamten Programm automatisch registriert und registriert werden können gebunden Legen Sie es auf jQuery fest. Wenn es ausgeführt wird, werden alle Module ausgeführt, die das Ereignis registriert haben. Beispielsweise definieren die im Modul User.js definierte UserUpdate-Methode und die in Blogs.js definierte BlogUpdate-Methode beide die Funktionfunction, die beim Veröffentlichen eines Blogs ausgeführt werden muss. Wir können eine Bindung an einen von jQuery angegebenen Container (z. B. document) herstellen, indem wir einen einheitlichen Ereignisnamen (z. B. BlogAdded) registrieren und dann nach erfolgreicher Veröffentlichung des Blogs $(document).trigger("BlodAdded) ausführen ") Das ist in Ordnung.

Nachfolgend geben wir einen allgemeinen Beispielcode an:

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

Dann definiert jedes js-Modul den Code installiert im folgenden Format:

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

Auf diese Weise, egal wo Sie sind, wenn wir brauchen, können wir jQuery verwenden, um unsere Ereignisse auszulösen:

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

Mit dieser Methode können Sie finden dass die Methode eines Moduls nur ein Ereignis registrieren kann. Wenn wir eine Methode verwenden, um mehrere Ereignisauslöser zu registrieren, können wir die folgende Methode verwenden:

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

Letzter Hinweis: Dieser Artikel zeigt nur ein einfaches Beispiel. Mischen Sie nicht die Verwendung desselben Ereignisnamens in verschiedenen Modulen. Beispielsweise AddComplete und AddComplete in User. js AddComplete in Blog.js ist möglicherweise überhaupt nicht verwandt, das heißt, es verarbeitet nur seine eigene entsprechende Logik. Zu diesem Zeitpunkt sollte dieses Ereignis nicht einheitlich verarbeitet werden, aber wenn die zu erkennenden Dinge gleich sind, sind Sie es kann es verwenden, z. B. DisableUserComplete. Es kann universell verwendet werden, da das Benutzermodul die Vorgänge nach der Deaktivierung des Kontos verarbeiten muss und das Blog-Modul möglicherweise auch die Vorgänge nach der Deaktivierung des Kontos verarbeiten muss.

Fazit

Notizen des Onkels: Zielt darauf ab, verschiedene Tipps und Informationen (einschließlich, aber nicht beschränkt auf Technologie) in der täglichen Arbeit aufzuzeichnen, sofern diese für Sie nützlich sind , bitte empfehlen Sie eines, um Onkel die Motivation zum Schreiben zu geben

Das obige ist der detaillierte Inhalt vonEine kurze Diskussion über die benutzerdefinierte Bindung von jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!