Verwenden Sie in jQuery bind, live oder on_jquery, um zukünftige Elementereignisse zu binden.-js-Tutorial-php.cn

Verwenden Sie in jQuery bind, live oder on_jquery, um zukünftige Elementereignisse zu binden.

WBOY

Freigeben： 2016-05-16 16:51:58

Original

1070 Leute haben es durchsucht

Sie können „bind“ nicht für zukünftige Elementbindungsereignisse verwenden. Sie können stattdessen „live“ verwenden, aber achten Sie auf die Version von jquery, die ab 1.7 nicht empfohlen wird in 1.9 live entfernt werden.

2. Es wird empfohlen, stattdessen on zu verwenden (Hinweis: wird nur von Versionen 1.7 und höher unterstützt). Verwendung: on(events,[selector],[data],fn)

Code kopieren Der Code lautet wie folgt:

//Es ist nur gültig, wenn es in $(function(){})

$(document).on("click", "#testDiv", function(){ 
 platziert wird //Hier bezieht sich $(this) auf $( "#testDiv"), nicht auf $(document) 

 
3 passendes Element (wie click ) Wenn Sie eine einmalige Ereignisverarbeitungsfunktion binden, verwenden Sie einfach .one() anstelle von on. Beachten Sie, dass sie nicht einmal auf allen [Selektoren], sondern auch nur einmal auf diesen [Auswahlen] ausgeführt wird gültig für zukünftige Elemente. 

4. Wenn es in einem Div drei Schaltflächen zum Hinzufügen, Löschen oder Ändern gibt, die an Ereignisse gebunden werden müssen, schreiben Sie wie folgt:

Code kopieren Der Code lautet wie folgt: $('#btn-add').click(function(){}); '#btn-del').click (function(){});

$('#btn-edit').click(function(){});

 
Der Nachteil Wenn man so schreibt: Man kann den Unterschied zwischen den drei strukturellen Zusammenhängen nicht erkennen, es gibt keinen Grund, dass Ereignisse aufsteigen. 

Werfen wir einen Blick auf die Empfehlungen von CoffeeDeveloper, um einige Gedanken zur jQuery-Ereignisbindung zu erhalten:

Code kopieren

Der Code lautet wie folgt: $("#btnContainer").coffee({ click: {

"#btn-add": function(){ //etwas tun },

"#btn-del": function(){ //etwas tun }, 
"#btn-edit": function(){ //etwas tun } 
} , 
mouseenter:{ 
"#btn-abc": function(){ //etwas tun }, 
} 
}); 

 
Schreiben Sie es so, Sieht es nicht viel besser aus? (.coffee() ist eine benutzerdefinierte Funktion. Können Sie diese Funktion selbst schreiben?) Wenn die gebundene Funktion jedoch relativ lang ist, sieht der Code immer noch etwas chaotisch aus 

Code kopieren

Der Code lautet wie folgt:

$('#btnContainer') .on ('click','# btn-add', function(){}) .on('click','#btn-del', function(){}) .on('click' ,'#btn-edit' ,function(){});

Diese Schreibweise vermeidet auch die beiden oben genannten Nachteile und sieht weniger chaotisch aus.

PHP8, ich komme auch

Lernen Sie das Website-Layout in 30 Minuten

Shangguan Oracle Video-Tutorial für Anfänger bis Fortgeschrittene

Ihre erste Zeile UNI-APP-Code

Flattern Sie von Grund auf bis zum App-Start

Brother Lian Neues Linux-Video-Tutorial

AXURE 9 Video-Tutorial (geeignet für die interaktive Produktdesign-Benutzeroberfläche von Product Manager)

Zero Basic Proficiency PS-Video-Tutorial

16-tägiges UI-Video-Tutorial für den Einstieg

PS-Techniken und Slicing-Techniken-Video-Tutorial

Video-Tutorial zum Bau und zur Projekteinführung der Alibaba Cloud-Umgebung

Überblick über Computernetzwerke – Grundkenntnisse, die Programmierer beherrschen müssen

Grundlegendes Tutorial für Programmierer – Erklärung des HTTP-Protokolls

Websocket-Video-Tutorial

Verwenden Sie in jQuery bind, live oder on_jquery, um zukünftige Elementereignisse zu binden.