小编j5D*_*Dev的帖子

如何在调用下一个函数之前等待jQuery动画完成?

在调用下一个函数之前,我无法完成jquery函数的完成.

基本上,我试图让我的新闻文章淡出,并完成所有的淡出动画,然后通过ajax检索下一页的文章.

继承人我所拥有的(Sampled仅包括相关功能).

一种控制每篇新闻文章淡出的功能......

function fadeArticlesOut() {
    var delay = 0;
    //set timeout for image to appear (set at 500ms)
    $('#news-articles article').each(function(index) {
        $(this).delay(delay).fadeTo(800, 0);
        delay += 400;       
    })
};          
Run Code Online (Sandbox Code Playgroud)

通过单击分页链接触发的功能.这会捕获通过ajax加载的url,但在此之前,这是我想要运行fadeout函数的地方,即fadeArticlesOut.我想要的是在运行loadProducts函数之前完成淡出动画.

function doPager() {
    $('.pagination-controls a').click(function(e) {
        e.preventDefault();

        fadeArticlesOut();          
        loadProducts($(this).attr('href'));
        history.pushState(null, null, $(this).attr('href'));
        historyedited = true;
    });
}

function loadProducts(url) {
    $('#news-articles').empty().addClass('loading').load(url + ' #news-articles-inner', function() {
        $('#news-articles').removeClass('loading');
        doPager();
        fadeArticlesIn();
    });
}
Run Code Online (Sandbox Code Playgroud)

一旦完成,负载产品功能将在新的新闻文章中淡出.

到目前为止,我尝试了很多方法,包括使用自定义回调,延迟对象和设置超时.我遇到的问题是我可以让它运行fadeouts,但是然后不继续使用ajax内容加载,或者没有fadeouts,但获取ajax内容.

jquery

4
推荐指数
1
解决办法
5078
查看次数

标签 统计

jquery ×1