jQuery的remove()绕过FX队列？我如何仅在链的末尾使用它？

Question

我有一个具有此行为的按钮:点击后它会消失; 然后一条小信息淡入几秒钟,淡出并再次出现按钮.

为了显示小消息,我在隐藏按钮后追加了一个元素,但是一旦消失了就需要将它从DOM中删除.但是,只要我在链中使用remove(),元素就会被删除,永远不会出现fadeIn/fadeOut!

// 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.