javascript - jQuery 的 remove() 绕过 FX 队列？我如何只在链的末端使用它？

Question

我有一个具有这种行为的按钮:单击后消失；然后一条小消息淡入几秒钟，淡出，按钮再次出现。

为了显示小消息，我在隐藏按钮后附加了一个元素，但需要在它淡出后将其从 DOM 中删除。但是，一旦我在链中使用 remove() ，元素就会被删除并且永远不会淡入/淡出!

// the button is generated dynamically
$('#myButton').live('click', function() {
    $(this)
        .fadeOut() // once clicked, the button disappears

        .after('<small style="display:none;">Dans panier</small>') // append the message after the button

        .next('small').fadeIn() // fade the new small message for a smooth effect

        .delay(1000) // leave it visible for a second...

        .fadeOut() // then fade it out

        .remove() // <-------- normally I would have remove it here from the DOM because it should be hidden, but the remove() method seems to be bypassing the other ones and the small message never shows up!

        .end() // stop using this object and return to the button

        .delay(1000) // use the same delay as the small message so they are timed

        .fadeIn(); // show it back at the end
});

Answer 1

如果想在fadeOut之后移除，可以使用回调方法:

[...]
.fadeOut(function(){ $(this).remove(); })

但是一旦删除它，您必须将其重新插入到 DOM 中，以便它以 fadeIn 重新出现。