Question

我使用此命令设置表格样式：

$("tr").filter(":odd").addClass("odd");

效果很好。现在我有一个悬停功能，当我将光标移动到一行时会显示光标。

问题：在悬停时我希望表格行再次返回其“奇数”类，以保持2色布局。不幸的是它不起作用 - 徘徊将导致一个普通的课程。

这是我的悬停代码：

function hover = function(tr,cod)
{
    if(cod)
    {
        tr.addClass("hover");
    }else{
        if(tr.is(":odd"))
        {
            tr.addClass("odd");
        }else{
            tr.removeClass();
        }
    }
}

任何人都可以告诉我出了什么问题？

提前thx。

Answer 1

我想你想要这个：

function hover = function(tr,cod)
{
    if(cod)
    {
        tr.addClass("hover");
    }else{
        tr.removeClass("hover");
    }
}

调用removeClass()删除所有类。由于节点可以应用多个类，因此可以添加和删除hover类，无论它是否奇怪。

Answer 2

你应该使用toggleClass（）而不是addClass（）+ removeClass（）。

Answer 3

你不需要删除所有添加的课程。只需在你的css中使用！important来悬停类。它将覆盖奇数类。

.hover {background-color:green !important;}
.odd {background-color:blue}

$("#datatable tr:odd").addClass("odd"); 
$("#datatable tr").mouseover(function() { $(this).addClass("hover"); });
$("#datatable tr").mouseout(function() { $(this).removeClass("hover"); });

jquery：奇数/偶数行元素+悬停

3 个答案: