Question

我有一个脚本，它将一些html加载到用户点击的链接上的div基础上。我正在尝试为此事件创建一个crossfade类型的动画。这是我正在使用的代码：

var loadInit = $('.thumbs a:first').attr("href");        
$('#loadTarget').load(loadInit);

$('.thumbs a').click(function(){
    var toLoad = $(this).attr('href');
    $('#loadTarget').hide('slow',loadContent);

    function loadContent() {
        $('#loadTarget').load(toLoad,'',showNewContent())
    }
    function showNewContent() {
        $('#loadTarget').show('slow');
    }
    return false;
});

我想要做的是暂停脚本，直到loadContent函数完全加载了与之关联的html和图像。当第一个内容被隐藏并且新内容被加载时，我得到了这个令人讨厌的闪存。任何想法??

Answer 1

jQuery load有一个在加载完成时调用的回调函数：

$('#loadTarget').load(loadInit, function(response) {
    alert('complete!  Returned: ' + response);
});

http://api.jquery.com/load/

<强>此外：

function loadContent() {
$('#loadTarget').load(toLoad,'',showNewContent()) //Wrong.
}

当您致电showNewContent()时，会立即执行。你想要做的是通过排除()。

来传递指向函数的指针

function loadContent() {
$('#loadTarget').load(toLoad, showNewContent) //Right :)
}

当您立即呼叫showNewContent时，这就是导致您闪烁的原因。

暂停jquery函数以等待ajax内容在继续之前加载

1 个答案: