web-dev-qa-db-de.com

Live () wird in jQuery zu on ()

Meine Anwendung hat dynamisch Dropdowns hinzugefügt. Der Benutzer kann beliebig viele hinzufügen.

Ich habe traditionell die Methode live() von jQuery verwendet, um festzustellen, wann eines dieser Dropdowns change() ist.

$('select[name^="income_type_"]').live('change', function() {
    alert($(this).val());
});

Seit jQuery 1.7 habe ich Folgendes aktualisiert:

$('select[name^="income_type_"]').on('change', function() {
    alert($(this).val());
});

Wenn Sie sich die Dokumente ansehen, sollte das absolut gültig sein (richtig?) - aber der Event-Handler wird niemals ausgelöst. Natürlich habe ich bestätigt, dass jQuery 1.7 geladen ist und ausgeführt wird usw. Das Fehlerprotokoll enthält keine Fehler.

Was mache ich falsch? Vielen Dank!

197
Jack

In der Dokumentation on heißt es (in Fettdruck;)):

Ereignishandler sind nur an die aktuell ausgewählten Elemente gebunden. Sie müssen auf der Seite vorhanden sein, wenn Ihr Code .on() aufruft.

Gleichbedeutend mit .live() wäre so etwas wie

$(document.body).on('change', 'select[name^="income_type_"]', function() {
    alert($(this).val());
});

Obwohl es besser ist, den Ereignishandler so nah wie möglich an die Elemente zu binden, d. H. An ein Element, das in der Hierarchie näher ist.

Update: Als ich eine andere Frage beantwortete, stellte ich fest, dass dies auch in der .live - Dokumentation erwähnt wird =:

Das Umschreiben der .live() -Methode in Bezug auf ihre Nachfolger ist unkompliziert. Hierbei handelt es sich um Vorlagen für entsprechende Aufrufe für alle drei Methoden zum Anhängen von Ereignissen:

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+
242
Felix Kling

Zusätzlich zu der ausgewählten Antwort

Hafen jQuery.live bis jQuery 1.9+, während Sie auf die Migration Ihrer Anwendung warten. Fügen Sie dies zu Ihrer JavaScript-Datei hinzu.

// Borrowed from jQuery 1.8.3's source code
jQuery.fn.extend({
  live: function( types, data, fn ) {
          if( window.console && console.warn ) {
           console.warn( "jQuery.live is deprecated. Use jQuery.on instead." );
          }

          jQuery( this.context ).on( types, this.selector, data, fn );
          return this;
        }
});

Hinweis: Die obige Funktion funktioniert in jQuery v3 nicht als this.selector ist entfernt.

Oder Sie können https://github.com/jquery/jquery-migrate verwenden

25

Wir haben gerade eine bessere Lösung gefunden, bei der kein Code von Drittanbietern bearbeitet wird:

https://github.com/jquery/jquery-migrate/#readme

Installieren Sie das jQuery Migrate NuGet-Paket in Visual Studio, damit alle Versionsprobleme behoben werden. Wenn Microsoft das nächste Mal seine unauffälligen AJAX und Validierungsmodule aktualisiert, versuchen Sie es möglicherweise ohne das Migrationsskript erneut, um festzustellen, ob das Problem behoben wurde.

Da jQuery Migrate von der jQuery Foundation verwaltet wird, ist dies meines Erachtens nicht nur der beste Ansatz für Bibliotheken von Drittanbietern, sondern auch, um Warnmeldungen für Ihre eigenen Bibliotheken zu erhalten, in denen ausführlich beschrieben wird, wie diese aktualisiert werden.

7
Tony Wall

Zusätzlich zu den ausgewählten Antworten

Wenn Sie Visual Studio verwenden, können Sie Regex Replace verwenden.
Unter Bearbeiten> Suchen und Ersetzen> In Dateien ersetzen
Oder Strg + Umschalt + H

Legen Sie im Popup Suchen und Ersetzen diese Felder fest

Find what:\$\((.*)\)\.live\((.*),
Ersetzen durch:$(document.body).on($2,$1,
Aktivieren Sie in den Suchoptionen "Reguläre Ausdrücke verwenden".

3
Maykol Rypka