web-dev-qa-db-fra.com

jquery live hover

J'utilise le code jQuery suivant pour afficher un bouton de suppression contextuelle uniquement pour les lignes de la table que nous survolons avec notre souris. Cela fonctionne, mais pas pour les lignes qui ont été ajoutées avec js/ajax à la volée ...

Y at-il un moyen de faire ce travail avec des événements en direct?

$("table tr").hover(
  function () {},
  function () {}
);
jquerylivejquery-1.4
162
Jorre

jQuery 1.4.1 prend désormais en charge le "survol" pour les événements live (), mais uniquement avec une fonction de gestionnaire d'événements:

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

function () {

});

Alternativement, vous pouvez fournir deux fonctions, une pour mouseenter et une pour mouseleave:

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

    },
    mouseleave: function () {

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

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

110
dmitko

.live() est obsolète à partir de jQuery 1.7

Utilisez .on() à la place et spécifiez un sélecteur descendant

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

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

Ce code fonctionne:

    $(".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");
            }
        });
5
Jorge E. Cardona

À partir de jQuery 1.4.1, l'événement de survol fonctionne avec live(). Fondamentalement, il se lie simplement aux événements mouseenter et mouseleave, ce que vous pouvez également faire avec les versions antérieures à 1.4.1:

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

Cela nécessite deux liaisons mais fonctionne tout aussi bien.

5
Tatu Ulmanen

AVERTISSEMENT: la version en direct du survol entraîne une baisse significative des performances. C'est particulièrement visible dans une grande page sur IE8.

Je travaille sur un projet dans lequel nous chargeons des menus multiniveaux avec AJAX (nous avons nos raisons :). Quoi qu’il en soit, j’ai utilisé la méthode en direct pour le survol qui a très bien fonctionné Chrome (IE9 a bien fonctionné, mais pas génial). Cependant, dans IE8, non seulement les menus ont été ralentis (vous avez dû survoler quelques secondes avant de les laisser tomber), mais tout ce qui était affiché sur la page était extrêmement lent. , y compris le défilement et même la vérification des cases à cocher simples.

La liaison des événements directement après leur chargement a permis d'obtenir des performances adéquates.

2
Brian