Question

您好我试着从表格html中滑下表格行，如下所示：

<table>
<tr class="toggle-tr" style="display:none;">
<td colspan="8">' +
                        '<h3>Class Code <span>' + (typeof data.result.ClassCode!='undefined' ? data.result.ClassCode : "") + '</span><a class="closeExpand pull-right" onclick="closeExpand(this)" href="javascript:void(0)">Close [x]</a></h3>' +
                        '<div class="table-responsive"><table class="table"><tr>' +
                        '<th class="sub_class_code">Sub Code</th>' +
                        '<th class="sub_class_code_th2">Class Description</th>' +
                        '</tr>' + (typeof data.result.SubCode!='undefined' ? data.result.SubCode : "") +
                        '</table></div>' +
                        '<div class="hazards">' +
                        '<p>Hazard Code <span>' + (typeof data.result.HazardCode!='undefined' ? data.result.HazardCode : "") + '</span></p>' +
                        '<p>Industry Group <span>' + (typeof data.result.IndustryGroup!='undefined' ? data.result.IndustryGroup : "") + '</span></p>' +
                        '<p>Industry Description <span>' + (typeof data.result.IndustryDescription!='undefined' ? data.result.IndustryDescription : "") + '</span></p>' +
                        '<p>Rate <span>' + (typeof data.result.Rate!='undefined' ? data.result.Rate : "") + '</span></p>' +
                        '<p>Effective Date <span>' + (typeof data.result.effDate!='undefined'? data.result.effDate : "" )+ '</span></p>' +
                        '</div>' +
                        '</td>' +
                        '</tr>
 </table>

该表有一个关闭slideUp的按钮，并且可以正常使用这个Jquery代码：

function closeExpand(obj) {

    var row = $(obj).closest('tr').children('td');

        $(row).animate({ paddingTop: 0, paddingBottom: 0 }, 800)
        .wrapInner('<div />')
        .children()
        .slideUp(800, function() { 
            $(this).closest('tr').remove(); 
        });


    previous_element = '';

}

但不知道如何在隐藏时将该桌子滑下来...请帮忙！感谢

Answer 1

我实际上通过在表格中放置一个div然后向下滑动Div来实现它，现在表格看起来像这样：

 success: function (data) {
                var html =<tr class="toggle-tr" ><td colspan="8">' +
                        '<div class="content toggle-tr" style="display:none;"><h3>Class Code <span>' + (typeof data.result.ClassCode!='undefined' ? data.result.ClassCode : "") + '</span><a class="closeExpand pull-right" onclick="closeExpand(this)" href="javascript:void(0)">Close [x]</a></h3>' +
                        '<div class="table-responsive"><table class="table"><tr>' +
                        '<th class="sub_class_code">Sub Code</th>' +
                        '<th class="sub_class_code_th2">Class Description</th>' +
                        '</tr>' + (typeof data.result.SubCode!='undefined' ? data.result.SubCode : "") +
                        '</table></div>' +
                        '<div class="hazards">' +
                        '<p>Hazard Code <span>' + (typeof data.result.HazardCode!='undefined' ? data.result.HazardCode : "") + '</span></p>' +
                        '<p>Industry Group <span>' + (typeof data.result.IndustryGroup!='undefined' ? data.result.IndustryGroup : "") + '</span></p>' +
                        '<p>Industry Description <span>' + (typeof data.result.IndustryDescription!='undefined' ? data.result.IndustryDescription : "") + '</span></p>' +
                        '<p>Rate <span>' + (typeof data.result.Rate!='undefined' ? data.result.Rate : "") + '</span></p>' +
                        '<p>Effective Date <span>' + (typeof data.result.effDate!='undefined'? data.result.effDate : "" )+ '</span></p>' +
                        '</div>' +
                        '</div>' +
                        '</td>' +
                        '</tr>
if (hiddenContent.is( ":hidden" )){
                // Hide it slowly.
                 hiddenContent.slideDown( 900 );
            } 

            }

如何使用Jquery SlideDown表？

1 个答案: