jQuery不断向我的表行添加display：block

Question

var str = '<tr class="task_row"><td>data.name</td><td>data.description</td></tr>';
$(str)
    .hide()
    .insertAfter($(clicked_item)
                     .parent()
                     .parent()
                     .parent()
                     .next()
                     .find('.header_row')
                 )
    .fadeIn("slow");

出于某种原因，当jQuery显示新行时，它会为<tr>提供display: block样式，这样整行只占用一个单元格。有没有办法阻止它以这种方式行事？

Answer 1

我明白了。

如果我添加：

$('.task_row').css('display', 'table-row');

在动画线之后，它会正确显示。

Answer 2

.fadeIn() jQuery后自动将display: block添加到元素中（我认为是CSS优先级）。您可以在.fadeIn()完成工作后将其删除。 Example：

var str = '<tr class="task_row"><td>data.name</td><td>data.description</td></tr>';
$(str)
    .hide()
    .insertAfter($(clicked_item)
                     .parent()
                     .parent()
                     .parent()
                     .next()
                     .find('.header_row')
                 )
    .fadeIn("slow", function() { $(this).removeAttr('style'); });