Jquery:一个接一个的触发器函数完成

Question

我有一个加载gif，它出现在rails应用程序的所有页面上，并在页面完全加载后淡出：

application.html.erb

$(window).load(function(){
    // remove loading animation
    if($('#loading').css('display')!='none'){
        $('#loading').fadeOut(400, function(){
           $('#main').animate({opacity:1});
    });
    }

在某些页面上，我想确保在加载图标消失之前不会触发。例如，当我加载项目页面时，我希望在加载图标完成后滚动到页面的中间，以便用户看到滚动动画。

project/index.html.erb

   $('.projectView').animate({scrollTop: $('.question_accordion').position().top});

我不能将它直接链接到加载fadeOut，因为加载fadeOut出现在每一页上，我只需要它只在步骤索引页上滚动。无论我做什么，都必须是项目/index.html.erb文件的一部分，而不是application.html.erb

如何仅在另一个代码完成后（在单独的函数中）触发javascript代码？

Answer 1

为loading元素的fx队列promise对象添加一个done回调。

// to ensure we run this right after the fadeOut is started
$(window).load(function(){
    $("#loading").promise().done(function(){
        $('.projectView').animate({scrollTop: $('.question_accordion').position().top});
    });
});