Question

我有一张桌子，我希望淡出多行并删除它们，然后，当它完成删除后，我需要一个回调来开始处理下一批行。

我知道为什么我的代码无效，$ trs.fadeOut会被删除的每一行调用一次。因此，finaliseNextBatchBookings最终被多次调用。

我不确定如何在删除最后一个$ trs后触发finaliseNextBatchBookings

var $trs = $checkboxes.closest('tr');

                        numBookingsFinalised += $trs.length;

                        $trs.fadeOut("normal", function () {
                            $(this).remove();
                            finaliseNextBatchBookings(numBookingsFinalised, finaliseBookingsCompleteCallback);
                        });

Answer 1

您可以使用动画返回的promise对象

$trs.fadeOut("normal").promise().done(function () {
    $trs.remove();
    console.log('done')
    finaliseNextBatchBookings(numBookingsFinalised, finaliseBookingsCompleteCallback);
});

var $trs = $('tr'),
  numBookingsFinalised, finaliseBookingsCompleteCallback;

$('#hide').click(function() {
  $trs.fadeOut("normal").promise().done(function() {
    console.log('done')
    $trs.remove();
    finaliseNextBatchBookings(numBookingsFinalised, finaliseBookingsCompleteCallback);
  });
});

function finaliseNextBatchBookings() {
  console.log('called')
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="hide">Hide</button>
<table>
  <tr><td>1</td></tr>
  <tr><td>2</td></tr>
  <tr><td>3</td></tr>
  <tr><td>4</td></tr>
</table>

从表中淡出多行后触发回调

1 个答案: