javascript jQuery 实时悬停
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4450125/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery live hover
提问by oshirowanen
I can't seem to convert the following into a live hover
我似乎无法将以下内容转换为实时悬停
$("li.favorite_item").hover(
function () {
$(this).append($(" <a href='#' class='button'>x</a>"));
},
function () {
$(this).find("a:last").remove();
}
);
I've tried:
我试过了：
$("li.favorite_item"").live('hover', function() {
function () {
$(this).append($(" <a href='#' class='button'>x</a>"));
},
function () {
$(this).find("a:last").remove();
}
});
But it does not work.
但它不起作用。
回答by Nick Craver
From jQuery 1.7+ .live() is deprecated, and .delegate() has been supersededby the .on() method.
从 jQuery 1.7+ 开始，.live() 已被弃用，.delegate() 已被.on() 方法取代。
Use .on()and .off()in place of .live(), and .die(). Use .on() in place of .delegate().
使用。对（）和.off（）代替.live（），和.die（）。使用 .on() 代替 .delegate()。
Converting older code is straightforward as explained here.
转换旧的代码很简单，如下解释。
You need to call the events that .hover()maps to separately, like this:
您需要分别调用.hover()映射到的事件，如下所示：
$("li.favorite_item").live('mouseenter', function() {
$(this).append($(" <a href='#' class='button'>x</a>"));
}).live('mouseleave', function () {
$(this).find("a:last").remove();
});
.hover()isn't an event function like .click()is for example, it's just a special shortcut for .mouseenter(handler1).mouseleave(handler2)...so you need to do the same in your .live()call.
.hover()不是一个事件函数.click()，例如，它只是一个特殊的快捷方式.mouseenter(handler1).mouseleave(handler2)......所以你需要在你的.live()通话中做同样的事情。
If you're on jQuery 1.4.3+, you can use a map to simplify things, like this:
如果您使用的是 jQuery 1.4.3+，则可以使用地图来简化事情，如下所示：
$("li.favorite_item").live({
mouseenter: function() {
$(this).append($(" <a href='#' class='button'>x</a>"));
},
mouseleave: function () {
$(this).find("a:last").remove();
}
});
Also, if this is on a specific <ul>, .delegate()is a better option, like this:
此外，如果这是在特定的<ul>,.delegate()是更好的选择，如下所示：
$("#myUL").delegate("li.favorite_item", {
mouseenter: function() {
$(this).append($(" <a href='#' class='button'>x</a>"));
},
mouseleave: function () {
$(this).find("a:last").remove();
}
});
回答by twf
The .live() syntax was nicer, but we have to use .on(), now.
.live() 语法更好，但我们现在必须使用 .on()。
You can use an event map on the document, with the selector as the 2nd argument:
您可以在文档上使用事件映射，将选择器作为第二个参数：
$(document).on({
mouseenter: function () {
$(this).append("<a href='#' class='button'>x</a>");
},
mouseleave: function () {
$(this).find("a:last").remove();
}
}, "li.favourite_item");
回答by idil miray
this is true...
这是真实的...
$("#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');
});
