等到某些代码运行答案

【问题标题】：wait until certain code is run等到某些代码运行
【发布时间】：2012-12-19 14:07:20
【问题描述】：

无论如何，我想知道是否有一种方法可以在运行新的代码行之前检测特定代码段是否正在运行直到它完成。

例如，

if(filterVal == 'all') {  
    jQuery('ul#portfolio li.hidden').fadeIn('slow').removeClass('hidden');  
} else {  
    jQuery('ul#portfolio li').each(function() {  
        if(!jQuery(this).hasClass(filterVal)) {  
            jQuery(this).fadeOut('normal').addClass('hidden');  
        } else {  
            jQuery(this).fadeIn('slow').removeClass('hidden');  
        }  
    });  
}

我要做的是在触发 jPages 函数创建分页之前，确保所有列表项元素都成功完成了 fadeIn(display:block) 和 fadeOut(display:none)。

【问题讨论】：

看一下fadeIn和fadeOut方法的回调参数。 api.jquery.com/fadeOut

标签： javascript jquery

【解决方案1】：

.fadeIn() 中有一个参数可以解决这个问题。

$('ul#portfolio li.hidden').fadeIn('slow', function()
{
    // Fade has finished, continue here.
    //
    //

});

【讨论】：

如果这个fadeOut方法有8个项目，我只想在它的末尾运行代码怎么办？因为我想对所有列表项实现 jPages 脚本。
@XavianTracy 我不确定你的意思。您的意思是您希望这些项目一个接一个地淡出并表现得好像它们“排队”一样，还是您的意思是您只希望回调在所有 8 个都淡出而不是 8 个单独的时间后运行一次？跨度>

【解决方案2】：

给它一个回调函数。试试：

jQuery(this).fadeOut('normal', function(){
    $(this).addClass('hidden'); 
})

如果必须多次执行，请使用：

jQuery('ul#portfolio li').each(function() {  
    if(!jQuery(this).hasClass(filterVal)) {  
        jQuery(this).addClass('hidden');  
    } else {  
        jQuery(this).removeClass('hidden');  
    }  
});  

$('ul#portfolio li.hidden').fadeOut('normal', function(){
    //Finished
});
$('ul#portfolio li:not("hidden")').fadeIn('slow', function(){
    //Finished
});

【讨论】：

这个fadeOut方法有8个项目，我只想在它的末尾运行代码？因为我想对所有列表项实现 jPages 脚本。

【解决方案3】：

所以我想我知道如何使用 .promise() 来做到这一点

我的代码如下所示：

jQuery('ul#portfolio li').promise().done(function()
{
    jQuery('ul#portfolio li').each(function()
    {
        console.log(jQuery(this).attr('class') + '-' + jQuery(this).css('display'));

    });

});

【讨论】：