javascript - `.load` 完成后执行函数

Question

我想在 slideUp 函数之后而不是之前加载文件（使用 href 变量）。

我的代码：

$(document).ready(function() {
    $("#content").show().load($(".link2:first").attr('href'));

    $(".link").click(function() {
        var href = $(this).attr('href');
        $("#content").slideUp("slow");
        $("#content").slideDown("slow").load(href);

        return false;
    });
});

和 HTML：

<a href="testar2.html" class="link">Link 1</a>
<a href="testar.html" class="link">Link 2</a>
<div id="content">-</div>

任何想法如何解决这一问题？

Answer 1

用这个：

$("#content").slideUp("slow", function(){
    $(this).load(href, function (responseText, status, req) {
        if (status != "error") $(this).slideDown("slow");
    });
});

我还添加了一个错误检查，以防万一.load()失败。

Answer 2

使用回调对您有利

$("#content").load(href, function() { 
    $(this).stop().slideDown("slow"); 
});

您可以通过将负载放在 slideUp 回调中以相同的方式包装负载。就我个人而言，我不会像上面那样等待动画完成，因为那是用户等待内容的更多时间。停止将终止向上动画。