Jquery 现场悬停

我使用下面的 jquery 代码来显示一个上下文删除按钮,它仅用于我们用鼠标悬停的表行。这可以工作,但不适用于动态添加了 js/ajax 的行..。

有没有什么办法可以把这个和现场活动结合起来?

$("table tr").hover(
function () {},
function () {}
);
104068 次浏览

从 jQuery 1.4.1开始,hover 事件与 live()一起工作。它基本上只是绑定到 mouseenter 和 mouseleave 事件,你也可以使用1.4.1之前的版本:

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

这需要两个绑定,但同样可以正常工作。

JQuery 1.4.1现在支持 live ()事件的“ hover”,但是只有一个事件处理函数:

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


function () {


});

或者,您可以提供两个函数,一个用于 mouseenter,一个用于 mouseleave:

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


},
mouseleave: function () {


}
});

这个代码是有效的:

    $(".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");
}
});
$('.hoverme').live('mouseover mouseout', function(event) {
if (event.type == 'mouseover') {
// do something on mouseover
} else {
// do something on mouseout
}
});

Http://api.jquery.com/live/

警告: 使用悬停的实时版本会带来很大的性能损失。这在 IE8的大页面中尤其明显。

我正在从事一个项目,我们加载多级菜单与 AJAX (我们有我们的原因:)。无论如何,我使用的悬停方法的工作在 Chrome 上很好(IE9做得不错,但不太好)。然而,在 IE8中,它不仅减慢了菜单的速度(你必须在它下降之前悬停几秒钟) ,而且页面上的所有东西都慢得令人痛苦,包括滚动甚至检查简单的复选框。

在事件加载后直接绑定事件可以获得足够的性能。

从 jQuery 1.7开始就不推荐使用 .live()

改为使用 .on()并指定子代选择器

Http://api.jquery.com/on/

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

您应该使用 $(document)。如果您不使用它,新添加的表行将无法正常工作。

$(document) . on (“ mouseover”,“ table tr”,function (event){

//显示按钮

});

$(document) . on (“ mouseout”,“ table tr”,function (event){

//隐藏按钮

});