jquery - .hide() 有效，但随后显示以前的动画？

Question

我有一个问题，我的动画效果很好，但是当 .hide(); 被触发它只是恢复到 slideDown(); 功能。

我正在摸索它，虽然我假设它正在运行动画，因为之前的点击仍然有效？

$('div.SocialShareJob').on('click', function(){
    $(this).find('p').slideUp(300).fadeOut(500);
    $(this).find('.Icons').slideDown(500).fadeIn(900);
});
$('div.CloseSharing').on('click', function(){
    $(this).parent('div.Icons').hide(); 
});

Answer 1

您需要停止尚未完成的动画，并清除队列：

$('div.CloseSharing').on('click', function(event){
    $(this).parent('div.Icons').stop(true).hide(); 
});

如果closeSharingdiv 是另一个 div 的子级，您可能还需要阻止click事件传播到父级。为此，请event.stopPropagation()在事件处理程序的开头添加：

$('div.CloseSharing').on('click', function(event){
    event.stopPropagation();
    $(this).parent('div.Icons').stop(true).hide(); 
});