jQuery vol stationnaire

Question

Je ne peux pas sembler en direct pour convertir les éléments suivants en vol stationnaire en direct

$("li.favorite_item").hover(
    function() { 
     $(this).append($(" <a href='#' class='button'>x</a>")); 
    }, 
    function() { 
     $(this).find("a:last").remove(); 
    } 
); 

J'ai essayé:

$("li.favorite_item"").live('hover', function() { 
    function() { 
     $(this).append($(" <a href='#' class='button'>x</a>")); 
    }, 
    function() { 
     $(this).find("a:last").remove(); 
    } 
}); 

Mais cela ne fonctionne pas.

Answer 1

De jQuery 1.7+ .live() est deprecated et .delegate() a été superseded par la méthode .on(). Utilisez .on() et .off() à la place de .live() et. Utilisez .on() à la place de .delegate().

La conversion de l'ancien code est simple as explained here.

---

Vous devez appeler les événements qui .hover() cartes à part, comme celui-ci:

$("li.favorite_item").live('mouseenter', function() { 
    $(this).append($(" <a href='#' class='button'>x</a>")); 
}).live('mouseleave', function() { 
    $(this).find("a:last").remove(); 
}); 

.hover() n'est pas une fonction d'événement comme .click() est par exemple, il est just a special shortcut for .mouseenter(handler1).mouseleave(handler2) ... si vous avez besoin faire la même chose dans votre appel .

Si vous êtes sur jQuery 1.4.3+, vous pouvez utiliser une carte pour simplifier les choses, comme ceci:

$("li.favorite_item").live({ 
    mouseenter: function() { 
    $(this).append($(" <a href='#' class='button'>x</a>")); 
    }, 
    mouseleave: function() { 
    $(this).find("a:last").remove(); 
    } 
}); 

En outre, si cela est un <ul> spécifique, .delegate() est une meilleure option, comme ceci:

$("#myUL").delegate("li.favorite_item", { 
    mouseenter: function() { 
    $(this).append($(" <a href='#' class='button'>x</a>")); 
    }, 
    mouseleave: function() { 
    $(this).find("a:last").remove(); 
    } 
}); 

Answer 2

La syntaxe .live() était plus agréable, mais nous devons utiliser .on(), maintenant.

Vous pouvez utiliser une carte de l'événement sur le document, avec le sélecteur comme 2ème argument:

$(document).on({ 
    mouseenter: function() { 
     $(this).append("<a href='#' class='button'>x</a>"); 
    }, 
    mouseleave: function() { 
     $(this).find("a:last").remove(); 
    } 
}, "li.favourite_item"); 

Answer 3

cela est vrai ...

$("#your_div_id").live('mouseover',function(){ 

    $(this).find(".child_div").css('background-color','#111111'); 

}).live('mouseout',function(){ 

    $(this).find(".child_div").css('background-color','#757575'); 
});