Question

我在tr行上有一个带有jquery onClick事件的表。我想突出显示当前选定的行。 “突出显示”表示：将背景颜色和普通字体更改为斜体字体。所以我创建了一个类“selected_row”，并在onClick中我将该类添加到该行。之前，我正在从所有其他行中删除该类，以便从先前突出显示的行中删除突出显示。问题是它工作正常，但仅适用于每隔一行。这是在IE8中运行的。我正在使用IE8中的开发人员工具进行检查，而且select_row类实际应用并且对于索引为1,3,5的每一行都可见...在DOM树中不应用或可见在调试器中，索引为0,2,4，... 我很无能为力。奇数和偶数索引的行之间没有任何区别。

以下是代码的一部分：

table th {
    background-color: #ededed; 
    padding: 5px;
}
table td {
    padding: 5px;
}
.selected_row {
    font-style: italic;
    background-color: #eeeeee;
}

JavaScript的：

var tableRowClickHandler = function () {
    if ($(this).hasClass ("header")) {
        // alert ('has class');
    }
    else {
        var _this = $(this)
        if (_this.hasClass ("selected_row")) {
            _this.removeClass ("selected_row");
        }
        else { 
            $("tr").each (function () {
            if (!$(this).hasClass ("header"))
                $(this).removeClass ("selected_row");
            });
            _this.addClass ("selected_row");
        }
    }
};

Answer 1

我认为你可以让这个功能更小：

var tableRowClickHandler = function () {
    if ($(this).hasClass ("header")) {
        return;
    }
    else {
        $("tr").removeClass ("selected_row");
        $(this).addClass ("selected_row");
    }
};

Answer 2

我通过不通过类添加样式但通过2个单独的css（）调用来设置颜色和字体样式来解决问题。这工作正常，这对我来说已经足够了。不知道为什么它不适用于addClass（）。

jquery addClass仅适用于每个第二个表行

2 个答案: