我喜欢Vinny写的插件，并一直在使用。但是对于在滑动行(tr/td)内的表，即使在滑动后，嵌套表的行始终是隐藏的。所以我做了一个快速和简单的hack在插件不隐藏行嵌套表。只要改一下下面这行

var $cells = $(this).find('td');

to

var $cells = $(this).find('> td');

它只找到直接的TDS而不是嵌套的。希望这有助于使用插件和嵌套表的人。

您可以尝试将行内容包装在<span>中，并让您的选择器为$('#detailed_edit_row span');-有点粗糙，但我刚刚测试过，它是有效的。我还尝试了上面的表行建议，但它似乎不起作用。

更新:我一直在研究这个问题，从所有迹象来看，jQuery需要它执行slideDown的对象是一个块元素。所以，不可能。我能够变出一个表，我在一个单元格上使用滑下来，它不影响布局，所以我不确定你是如何设置的。我认为你唯一的解决方案是重构表，以这样一种方式，即单元格是一个块，或者只是.show();该死的东西。祝你好运。

http://jsfiddle.net/PvwfK/136/

<table cellspacing='0' cellpadding='0' class='table01' id='form_table' style='width:100%;'>
<tr>
    <td style='cursor:pointer; width:20%; text-align:left;' id='header'>
        <label style='cursor:pointer;'> <b id='header01'>▲ Customer Details</b>

        </label>
    </td>
</tr>
<tr>
    <td style='widtd:20%; text-align:left;'>
        <div id='content' class='content01'>
            <table cellspacing='0' cellpadding='0' id='form_table'>
                <tr>
                    <td>A/C ID</td>
                    <td>:</td>
                    <td>3000/A01</td>
                </tr>
                <tr>
                    <td>A/C ID</td>
                    <td>:</td>
                    <td>3000/A01</td>
                </tr>
                <tr>
                    <td>A/C ID</td>
                    <td>:</td>
                    <td>3000/A01</td>
                </tr>
            </table>
        </div>
    </td>
</tr>

$(function () {
$(".table01 td").on("click", function () {
    var $rows = $('.content01');
    if ($(".content01:first").is(":hidden")) {
        $("#header01").text("▲ Customer Details");
        $(".content01:first").slideDown();
    } else {
        $("#header01").text("▼ Customer Details");
        $(".content01:first").slideUp();
    }
});

});

快速、简单的解决办法:

使用JQuery .toggle()显示/隐藏行点击或锚。

需要编写一个函数来识别想要隐藏的行，但是toggle可以创建您正在寻找的功能。

有一个表行嵌套表:

<tr class='dummyRow' style='display: none;'>
    <td>
        <table style='display: none;'>All row content inside here</table>
    </td>
</tr>

向下滑动行:

$('.dummyRow').show().find("table").slideDown();

注意:行和它的内容(这里是“table”)都应该在动画开始之前被隐藏。

上滑行:

$('.dummyRow').find("table").slideUp('normal', function(){$('.dummyRow').hide();});

第二个参数(function())是一个回调。

简单! !

请注意，还有几个选项可以添加为滑动上/下函数的参数(最常见的是“慢”和“快”的持续时间)。

如果你需要同时滑动和淡出一个表行，尝试使用这些:

jQuery.fn.prepareTableRowForSliding = function() {
    $tr = this;
    $tr.children('td').wrapInner('<div style="display: none;" />');
    return $tr;
};

jQuery.fn.slideFadeTableRow = function(speed, easing, callback) {
    $tr = this;
    if ($tr.is(':hidden')) {
        $tr.show().find('td > div').animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
    } else {
        $tr.find('td > div').animate({opacity: 'toggle', height: 'toggle'}, speed, easing, function(){
            $tr.hide();
            callback();
        });
    }
    return $tr;
};

$(document).ready(function(){
    $('tr.special').hide().prepareTableRowForSliding();
    $('a.toggle').toggle(function(){
        $button = $(this);
        $tr = $button.closest('tr.special'); //this will be specific to your situation
        $tr.slideFadeTableRow(300, 'swing', function(){
            $button.text('Hide table row');
        });
    }, function(){
        $button = $(this);
        $tr = $button.closest('tr.special'); //this will be specific to your situation
        $tr.slideFadeTableRow(300, 'swing', function(){
            $button.text('Display table row');
        });
});
});