Question

我有一张桌子，一年中有12个月（jan到dec）

然后我将一些月份组合在一起，即：jan到apr = group1，mar到jun = group2

所以我想做的就是改变所有具有相同组名的项目的背景颜色。

$('.group1').hover(function() {
    $(this).addClass('tbl_navGroupHover');
}, function() {
    $(this).removeClass('tbl_navGroupHover');
});

$('.group2').hover(function() {
    $(this).addClass('tbl_navGroupHover');
}, function() {
    $(this).removeClass('tbl_navGroupHover');
});

http://jsfiddle.net/Q49Rd/1/

更新，我选择了这个解决方案 - tx寻求帮助：

<script>";
for ($i = 1; $i < 13; $i++) {
echo "$('.group$i').hover(function() {
    $('.group$i').addClass('tbl_navGroupHover');
}, function () {
    $('.group$i').removeClass('tbl_navGroupHover');
});";
}
echo "</script>";

Answer 1

将this替换为组类名，您也可以使用toggleClass方法。

$('.group1').hover(function() {
    $('.group1').toggleClass('tbl_navGroupHover');
});

$('.group2').hover(function() {
    $('.group2').toggleClass('tbl_navGroupHover');
});

http://jsfiddle.net/5cAfR/

请注意，你还没有在小提琴中加载jQuery。

Answer 2

请勿使用this使用类名代替所有

进行更改

$(this).addClass('tbl_navGroupHover');

应该

$(".group1").addClass('tbl_navGroupHover');

Answer 3

不确定这是否有所不同，但在jquery文档中，'。hover'函数同时使用“handlerIn”和“handlerOut”函数。

您可以尝试以下方法：

$('.group1').hover(function() {
    $('.group1').addClass('tbl_navGroupHover');
}, function() {
     $('.group1').removeClass('tbl_navGroupHover');
});

$('.group2').hover(function() {
    $('.group2').addClass('tbl_navGroupHover');
}, function () {
    $('.group2').removeClass('tbl_navGroupHover');
});

不确定这是否会有所作为。您可能只能指定一个函数并逃脱它。这将在其中一个项目悬停时更改背景颜色，然后在移出项目时移除颜色。

希望这有帮助。

jquery悬停同一类的多个元素

3 个答案: