jquery live hover

Question

Ich verwende den folgenden jquery-Code, um eine kontextbezogene Löschschaltfläche nur für Tabellenzeilen anzuzeigen, die wir mit der Maus bewegen. Dies funktioniert aber nicht für Zeilen, die mit js/ajax on the fly hinzugefügt wurden ...

Gibt es eine Möglichkeit, dies mit Live-Events funktionieren zu lassen?

$("table tr").hover(
    function() {}, 
    function() {} 
); 

Answer 1

jQuery 1.4.1 unterstützt jetzt „schweben“ live() Ereignisse, sondern nur mit einem Event-Handler-Funktion:

$("table tr").live("hover", 

function() { 

}); 

Alternativ können Sie zwei Funktionen, eine für MouseEnter- und eine für mouseleave bieten:

$("table tr").live({ 
    mouseenter: function() { 

    }, 
    mouseleave: function() { 

    } 
}); 

Answer 2

Ab jQuery 1.4.1 arbeitet das Hover-Ereignis mit live(). Es bindet im Grunde nur auf die MouseEnter- und mouseleave Ereignisse, die Sie vor der 1.4.1 mit Versionen tun können genauso gut:

$("table tr") 
    .mouseenter(function() { 
     // Hover starts 
    }) 
    .mouseleave(function() { 
     // Hover ends 
    }); 

Dies erfordert zwei bindet, funktioniert aber genauso gut.

Answer 3

Dieser Code funktioniert:

$(".ui-button-text").live(
     'hover', 
     function (ev) { 
      if (ev.type == 'mouseover') { 
       $(this).addClass("ui-state-hover"); 
      } 

      if (ev.type == 'mouseout') { 
       $(this).removeClass("ui-state-hover"); 
      } 
     }); 

Answer 4

$('.hoverme').live('mouseover mouseout', function(event) { 
    if (event.type == 'mouseover') { 
    // do something on mouseover 
    } else { 
    // do something on mouseout 
    } 
}); 

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

Answer 5

WARNUNG: Bei der Live-Version von Hover tritt eine erhebliche Leistungseinbuße auf. Es ist besonders auf einer großen Seite auf IE8 bemerkbar.

Ich arbeite an einem Projekt, wo wir mehrstufige Menüs mit AJAX laden (wir haben unsere Gründe :). Wie auch immer, ich habe die Live-Methode für den Hover verwendet, die auf Chrome funktioniert hat (IE9 war OK, aber nicht großartig). In IE8 verlangsamte es jedoch nicht nur die Menüs (Sie mussten für ein paar Sekunden schweben, bevor es fallen würde), aber alles auf der Seite war schmerzhaft langsam, einschließlich Scrollen und sogar das Überprüfen einfacher Checkboxen.

Die Bindung der Ereignisse direkt nach dem Laden führte zu einer angemessenen Leistung.

Answer 6

.live() hat als von jQuery 1.7

Verwenden .on() statt und geben Sie einen Abkömmling Selektor

http://api.jquery.com/on/

$("table").on({ 
    mouseenter: function(){ 
    $(this).addClass("inside"); 
    }, 
    mouseleave: function(){ 
    $(this).removeClass("inside"); 
    } 
}, "tr"); // descendant selector