使用jQuery突出显示行

我想要一个函数，当鼠标滑过时突出显示表格的一行。我目前有一个函数，每隔一行创建一个交替的行颜色，我想修改它而不是创建一个单独的函数。下面是我有：使用jQuery突出显示行

$(".tblRows tr:even").addClass("altColor");

其中

.altColor TD { 
background-color:#f5f5f5 
}

和我的HTML是

<table class="tblRows"> 
...

我知道有一个jQuery函数悬停（），但我不知道如何将它与我有什么。当徘徊，我想它使用class =“hilite”

这可能吗？

来源

2011-01-08 santa

是不是有一个原因，你不只是使用CSS的呢？

#myTable tr:hover { 
    background: orange; 
}

不会在IE6中的<tr>上工作，但可以在其他地方使用。

例子：http://jsfiddle.net/auWGU/

来源

2011-01-08 21:22:33 user113716

$('.tblRows tr') 
    .mouseenter(function() { $(this).addClass('hilite'); }) 
    .mouseleave(function() { $(this).removeClass('hilite'); };

来源

2011-01-08 21:09:17

感谢@大卫，没有注意到我忘了。 @santa我想你可以像别人指出的那样使用`.hover`。这真的取决于你最喜欢的东西，我想。 :) – 2011-01-08 21:18:55

`$（this）`不`这个`，它需要是一个jQuery对象[JS Fiddle演示]（http://www.jsfiddle.net/davidThomas/bECGe/）（我删除了原来的评论，因为我想要编辑一个链接到演示为什么`this`需要是'$（this）`，这就是为什么我感谢的评论出现在评论后感谢我......）=） – 2011-01-08 21:21:09

使用hover：

$(".tblRows tr").hover(function() { 
    $(this).addClass("hilite"); 
}, function() { 
    $(this).removeClass("hilite"); 
});

这是简写：

$(".tblRows tr").mouseenter(function() { 
    $(this).addClass("hilite"); 
}).mouseleave(function() { 
    $(this).removeClass("hilite"); 
});

这里举例：http://jsfiddle.net/andrewwhitaker/kQvJ3/

来源

2011-01-08 21:12:20

需要悬停功能需要增加鼠标，过事件处理程序到表中的每一行。例如：

$('.tblRows tr').hover(function() { 
    $(this).toggleClass('hilite'); 
}, 
function() { 
    $(this).toggleClass('hilite'); 
});

来源

2011-01-08 21:14:21 Simon

使用jQuery突出显示行

回答

相关问题