1

用户单击后,我正在使用fadeIn扩展表中的行。在 Chrome 甚至 IE 中一切正常,但在 Firefox 15.0.1 中不起作用。在 FF 中,扩展行淡入淡出后,其背景会闪烁一次。

这是我的代码:

$('.patients-items-item').click(function() {
    var item = $(this).next('.toggle-item');

    if (item.is(":visible")) {
        item.hide();
    } else {
        item.fadeIn();
    }
});

html:

<table class="patients-table">
    <tbody class="patients-items">
        <tr class="patients-items-item">
            <td>
                <span class="button collapsed"></span>
            </td>
            <td>
                Text
            </td>
            <td >
                Text2
            </td>
        </tr>
        <tr class="toggle-item">
            <td colspan="3" class="patients-studies-empty">
                Text3
            </td>
        </tr>
    </tbody>
</table>

看看小提琴

在调查期间,我发现这种行为只存在于表格中。如果我对divs代码做同样的事情,那么在所有浏览器中都可以正常工作。

任何建议都会有所帮助。

4

2 回答 2

2

在 jQuery 中,您可以使用toggle()函数来获得您想要的行为。

请参见此处的示例:

http://jsfiddle.net/83tNC/

$('.patients-items-item').on('click', function() {

    $(this).next('.toggle-item').toggle('fade');

});​
于 2012-10-11T15:11:13.307 回答
0

你为什么不试试

item.stop().fadeIn();

另外,如果您要切换,为什么不使用:

item.stop().fadeToggle("slow", "linear");
于 2012-10-11T15:10:06.583 回答