jQuery 内容在 .load() 成功期间不会淡入

Question

我已经研究过几个类似的问题，但似乎没有一个起作用。我正在尝试使用 jQuery 单击事件来 fadeOut() 目标 div，从单击的元素的 href 异步加载() 目标 div 的内容，然后 fadeIn() 新内容。

有问题的网站是 http://clients.weareno1.com/worklocal.org/。

我的代码如下：

$(document).ready(function() {
    $("#pri_nav a").click(function() {
        $("#content").fadeOut(400, "linear").load(this.href, function() {
            $("#content").fadeIn(800, "linear");
        });
    });
});

设置将 'e' 传递给 click 函数（即 $("#pri_nav a").click(function(e) {e.preventDefault(); [....] 让我完成了大部分工作，但随后我不得不手动删除并替换锚点的父 li 中的“选定”类。最坏的情况，这就是我要做的，但似乎有点不必要的复杂。

非常感谢

您的宝贵时间。

Answer 1

您在评论中提到了 SEO 收益。搜索引擎不执行 JavaScript 代码。只要您的应用程序在 JavaScript 关闭的情况下工作，搜索引擎（以及有辅助功能需求的人）就能够跟踪链接。

fade* 方法不是同步的。我不会那样链接负载。

$(document).ready(function() {
    $("#pri_nav a").click(function() {
        var a = this;
        $("#content").fadeOut(400, "linear", function() {
            $("#content").load(a.href, function() {
                $("#content").fadeIn(800, "linear");
            });
        });
        return false;  // or prevent default
    });
});