Wie bindet man .hover() an dynamisch erzeugte "li" -Elemente?

Question

Alle Lösungen, die ich finden konnte schlägt vor, .live() Methode zu verwenden. Aber ab heute ist es veraltet.

.hover() funktioniert perfekt auf "li" -Elemente, die nicht dynamisch erstellt werden. Aber sobald ich neue "li" anhängen, wird überhaupt nicht ausgelöst.

Jeder hat das herausgefunden?

Answer 1

Das Ereignis "Hover" wurde mit delegierter Ereignisbehandlung wie .on() per .on() jQuery doc pages veraltet.

Stattdessen müssen Sie .on() delegierte Ereignisbehandlung mit Mouseenter und Mouselave und einen Event-Handler für jede.

Zum Beispiel:

$(document).on("mouseenter", "li", function() { 
    // hover starts code here 
}); 

$(document).on("mouseleave", "li", function() { 
    // hover ends code here 
}); 

In Ihrem echten Code, würden wählen Sie ein statisches übergeordnetes Objekt, das viel näher an die dynamischen li Tags als das document Objekt für eine bessere Leistung.

Answer 2

Verwenden JQuery On Try this:

$(document).on('hover', 'li', function() { 

}); 

Answer 3

dieses Versuchen

Edit: Sry das deprecated Ereignis verpasst

$(document).on("mouseenter", "li", function(){ 
     //Your code 
}); 

http://api.jquery.com/live/

fiddle