tablesorter 删除一行后，排序留下了一个空白

Question

这是我正在使用的 this to slide up a row in a table. I also created a codepen。

$(".tablesorter").tablesorter();

$('.remove').on('click', function(){
  $(this).closest('tr').children('td').animate({ padding: 0 }).wrapInner('<div/>').children().slideUp(function () {
    $(this).closest('tr').remove();
  });
  $(".tablesorter").trigger('update');
});

目标：

点击移除时向上滑动行
正确排序无间隙

现在可以向上滑动了。但是在向上滑动之后，排序在行之间留下了一个间隙——被删除的行显示为一个间隙（在 codepen 中不是很明显）。那么如何完全删除该行呢？或者为什么排序后又出现了？

实际上，如果我不向上滑动直接删除行，排序效果很好，但是客户喜欢向上滑动...

Answer 1

由于 .animate() 方法是异步的，执行会在您调用 .animate() 后立即继续，并且在实际行从table.

在 animate 方法上使用回调函数并在那里更新 table排序器。

示例：

$('.remove').on('click', function(){
   $(this).closest('tr').children('td').animate({ padding: 0 }).wrapInner('<div />').children().slideUp(function () {
        $(this).closest('tr').remove();
        $(".tablesorter").trigger('update');
    });
});

tablesorter 删除一行后，排序留下了一个空白

tablesorter after removed a row, sorting left a gap

css

jquery

tablesorter