JQuery Kochbuch (German Edition)

erzeugen Sie einfach ein internes Objekt, in dem Sie dokumentieren, welche Methoden überladen wurden. Dann ignorieren Sie wiederholte Aufrufe.
Nutzen Sie
jQuery.event.special
: Dadurch müssen Sie nicht für jede Methode, die Sie überladen wollen,
jQuery.broadcast()
aufrufen.
Stattdessen fügen Sie für jede Methode einen Eintrag in
jQuery.event.special
hinzu und rufen intern
jQuery.broadcast()
auf, wenn jemand ein Event bindet. Dies sollte mit der Prüfung auf doppelte Aufrufe verbunden werden.

Objekt-Methoden als Event Listener nutzen
    Problem
    Sie haben Objekte mit Methoden und Attributen und wollen diese Methoden (Funktionen) als Eventhandler übergeben. Das Problem besteht darin, dass die Methoden dann die »Referenz« auf das Objekt verlieren und Sie keine Möglichkeit haben, sich innerhalb des Eventhandlers auf das Objekt zu beziehen.
    Lösung
    Dies ist nicht leicht zu lösen. Sie müssen dafür Closures erzeugen, die das Objekt kapseln, und diese an
bind()
übergeben.
    Seit jQuery 1.3.3 besitzt
bind()
einen neuen Parameter. Mit diesem können Sie ein Objekt als Gültigkeitsbereich oder
this
des Eventhandlers angeben, ohne Funktions-Closures nutzen zu müssen.
    Dadurch wird der notwendige Code kürzer und schneller. Sie können nun die Objekt-Methode als Funktion und das Objekt selbst als Gültigkeitsbereich übergeben.
    Diskussion
    Wo ist der Knoten hin?
    Sie werden sich dies bestimmt früher oder später fragen. Ich habe weiter vorne angeführt, dass bei der Übergabe eines Scope-Objekts an
bind()
das
this
des Eventhandlers überschrieben wird. Wir können also den Knoten nicht wie üblich einlesen – aber er ist nicht verloren.
    Übergeben Sie ein Scope-Objekt an die Methode
bind()
, dann wird bei den Events das
this
des Eventhandlers auf das Scope-Objekt gesetzt. Sie können das Element, das dem Event mitgegeben wird, immer noch bestimmen, indem Sie die Eigenschaft
event.currentTarget
nutzen, die eine Referenz auf das DOM-Element enthält.
    Normalerweise ist dies nicht notwendig, weil
this
kürzer ist, aber in solchen Situationen handelt es sich um die einzige Möglichkeit.
    Das Beispiel
    Ich werde ein kleines Beispiel erstellen, das Ihnen zeigen soll, wie man den Scope-Parameter nutzt und in welcher Situation dies nützlich ist.
    Die Objekte
    Wir benötigen für das Beispiel zwei Objekte. Beide haben eine Methode, die wir als Eventhandler binden wollen.
    Dies sind die Objekte:
function Person(name){
this.name = name;
this.married = false;
}

jQuery.extend( Person.prototype, {
    whatIsYourName: function(){
     alert(this.name);
    },
    updateMarriedState: function(e){
     var checkbox = e.currentTarget;
     this.married = checkbox.checked;
    }
});

var peter = new Person('Peter');
var susan = new Person('Susan');
    Die Methoden binden
    Lassen Sie uns annehmen, dass eine Form mit zwei Checkboxen vorliegt (
#c1
und
#c2
). Beide haben Einfluss auf den Status married eines der vorigen Objekte.
jQuery('#c1').bind('change', peter.updateMarriedState, peter);
jQuery('#c2').bind('change', susan.updateMarriedState, susan);
    Dank des Scope-Attributs müssen wir keine neuen Funktionen für jedes Binding erstellen, sondern können auf die Objekt-Methoden zurückgreifen.
    Die Methoden müssen nicht einmal direkt mit den Objekten verbunden sein. Sie könnten auch Folgendes tun:
function updatePersonMarriedState (e){
var checkbox = e.currentTarget;
this.married = checkbox.checked;
}
jQuery('#c1').bind('change', updatePersonMarriedState , peter);
jQuery('#c2').bind('change', updatePersonMarriedState , susan);
    Wie Sie sehen, müssen die Funktionen nicht im Prototypen des Objekts angesiedelt sein – es kann tatsächlich sogar sinnvoller sein, sie getrennt zu halten. Warum sollte eine Methode, die zu
Person
gehört, über Checkboxen und den Knoten Bescheid wissen müssen? Es ist doch wohl sauberer, all die DOM-Veränderungen von den Daten fern zu halten.
    In manchen Fällen müssen die Objekt-Methoden gar nichts über den Knoten oder das Event-Objekt wissen. In diesem Fall können wir direkt eine Methode binden und vermischen so auch nicht DOM und Daten.
    Müssten wir zwei Buttons erstellen (
#b1
und
#b2
), um bei einem Klick den Namen einer Person anzuzeigen, wäre das genauso einfach:
jQuery('#b1').bind('click', peter.whatIsYourName, peter);
jQuery('#b2').bind('click', susan.whatIsYourName, susan);
    Es sei darauf hingewiesen, dass beide Methoden tatsächlich identisch sind:
peter .whatIsYourName == susan .whatIsYourName ; //