jquery - jQuery fadeToggle使行背景色消失

这是仅Firefox的问题。在Chrome和Internet Explorer上运行良好。

如果表行上有background-color，然后使用fadeToggle隐藏该行，然后再次显示它，则填充的背景色将恢复为默认值。

我把它困在了这个JSFiddle上，它只有一个链接执行单行的fadeToggle。

切换之前



切换后



的HTML

<a href="#" id="toggle">Toggle</a>
<table class="">
    <tr class="cat1">
        <td>data1</td><td>data2</td>
    </tr>
</table>

的CSS

body {background-color: #ccc}
table {border-collapse: collapse; background-color: #fff}
td {border: 1px solid black; padding: 10px;}
tr.cat1 {background-color: #ddd;}

jQuery的

$(document).ready(function() {
    $('#toggle').click(function () {
        $('tr.cat1').fadeToggle('fast');
    });
});

我发现的事情：


如果切换选项卡然后再切换回，则背景颜色会自行修复
如果删除border-collapse: collapse，则问题消失了
jQuery hide然后show正常工作


那么能否使fadeToggle在Firefox中正常工作？

最佳答案

此1适用于u：-WORKING DEMO

$('#toggle').click(function () {
      $('tr.cat1 td').fadeToggle();
});