Question

我有以下切换功能filter()，其中在点击childrow父级时显示表的<tr>。在此功能中，我还包括一个键快捷键，因此每当按下ALT + A时，都会显示所有的子帧。

此外，我还有另一个脚本mouseover()，其中父tr的背景颜色更改为#2C4367悬停。

所以这就是我的问题：每当我展开（点击）它并在关闭时恢复正常，我怎样才能切换tr父级的背景颜色。当按下快捷键时，此功能也适用于所有tr父项，因此当按下快捷键时，所有父tr的背景颜色都会改变。

我希望自己清楚明白。否则请说出来，我会尽力详细说明。

Toggle filter() script:

$(document).ready(function mouseover(){
    $(".parent").hover(function(){
        $(this).css("background", "#2C4367");
        $(this).css("color", "#FFFFFF");
    },
    function(){
        $(this).css("background", "#FFFFFF");
        $(this).css("color", "#000000");
    });
});

Change bgcolor mouseover() script:

$(document).ready(function filter() {
    $('table.detail').each(function() {
        var $table = $(this);
        $table.find('.parent').click(function() {
            $(this).nextUntil('.parent').toggle(); // must use jQuery 1.4 for nextUntil() method

        }); /// Below is toggle on image
        var $childRows = $table.find('tbody tr').not('.parent').hide();
        $("img.pushme").toggle(function funcVis() {
            $childRows.show();
        },
        function() { $childRows.hide();
        });
        shortcut.add("Alt+A",function(){ funcVis() }); /// Shortcut functions
        shortcut.add("Alt+N",function(){ expandform() }); /// Shortcut functions
    });
});

Answer 1

创建一个定义background-color更改的CSS类，并使用

应用或删除它

$(target).parent().toggleClass('yourclass');

在触发展开的任何地方插入此行。

Answer 2

解决！

JSFiddle

function toggle(it) {

    if ((it.className == "") || (it.className == "rowactive")) {
        it.className = "rownotactive";
    } else {
        it.className = "rowactive";
    }
}

$(document).ready(function filter() {
    $('table.detail').each(function () {
        var $table = $(this);
        $table.find('.parent').click(function () {

            $(this).toggleClass('rowactive');
            $(this).nextUntil('.parent').toggle();

        }); /// Below is toggle on image

        var $childRows = $table.find('tbody tr').not('.parent').hide();

        $("img.pushme").toggle(function funcVis() {
            $("tr.parent").addClass('rowactive');
            $childRows.show();

        },

        function () {
            $("tr.parent").removeClass('rowactive');
            $childRows.hide();

        });
        shortcut.add("Alt+N", function () {
            expandform()
        }); /// Shortcut functions
    });
});

在切换的tr和键快捷键上更改bgcolor

2 个答案: