jquery fadeOut/fadeIn 在 IE 中不起作用

Question

我有一个网站，其中有一个包含内容的 div 和一个导航栏（看起来像三个选项卡）。我的页面上也有 JQuery。这就是 JQuery 正在做的事情......当您单击其中一个选项卡时，它应该淡出整个 div，更改 div 的内容以与所选选项卡相对应（这是通过 ajax 命中来完成的）外部页面），最后再次淡入 div。

我的问题是 IE 不会淡入 div 回来。不知道如何解决这个问题。任何帮助表示赞赏。

谢谢！

JQUERY：

$(window).ready(function(){
    $(".navbar.home").click(function(){
        $(this).parent().fadeOut(150, function(){
            $(this).find("div:eq(3)").load("info.html");
            $("#mainWrapper").css("background-image","url(images/backHome.png)");
            $("title").html("Ndoto - For Africa's Future");
        });
        $(this).parent().fadeIn(150, function(){});
    });
    $(".navbar.visionMission").click(function(){
        $(this).parent().fadeOut(150, function(){
            $(this).find("div:eq(3)").load("visionMission.html");
            $("#mainWrapper").css("background-image","url(images/backVisionMission.png)");
            $("title").html("Vision and Mission Statement | Vision/Mission | Ndoto - For Africa's Future");
        });
        $(this).parent().fadeIn(150, function(){});
    });
    $(".navbar.donate").click(function(){
        $(this).parent().fadeOut(150, function(){
            $(this).find("div:eq(3)").load("donate.html");
            $("#mainWrapper").css("background-image","url(images/backDonate.png)");
            $("title").html("Donate and help a Student | Donate | Ndoto - For Africa's Future");
        });
        $(this).parent().fadeIn(150, function(){});
    });
});

HTML 代码：

<div id="mainWrapper">
<div style="cursor: pointer;" class="navbar home">home</div>
<div style="cursor: pointer;" class="navbar visionMission">vision/mission</div>
<div style="cursor: pointer;" class="navbar donate">donate</div>
<div id="home">
<div class="clear">&nbsp;</div>
<div class="headline">dream&nbsp;&nbsp;-&nbsp;&nbsp;volunteer&nbsp;&nbsp;-&nbsp;&nbsp;invest</div>
<div class="clear">&nbsp;</div>
<div class="text-body home">
At Ndoto we believe that education is a fundamental piece to the complicated puzzle of eradicating poverty.  Without an education, young people will forever struggle to find regular employment, instead depending on the day-to-day sustenance of small informal businesses.  In addition, going to school is an excellent way to get young people focused, working hard, and exposed to new things that expand their world view.  Therefore, our student sponsorship program forms the core of Ndoto.
<br><br>
If transformation is to happen, it has to happen in all areas of a person’s life.  Ndoto’s students are encouraged to <strong>dream</strong> about what they want to do and how it will impact their country.  Then, they are given the opportunity to put this into action by going to school.  They are held accountable for how they use their education, as they must maintain grades, <strong>volunteer</strong> in their community, meet with a mentor, participate in a Christian community, and <strong>invest</strong><br>in the lives of others.
</div>
</div>

Answer 1

由于某种原因，当您尝试更改标题时似乎出现问题，如果删除标题则不会出现错误。

话虽如此：

$(function(){
    $(".navbar.home").click(function(){
        $(this).parent().fadeOut(150, function(){
            $(this).find("div:eq(3)").load("info.html");
            $("#mainWrapper").css("background-image","url(images/backHome.png)");
             document.title  ="Ndoto - For Africa's Future</title>";
            $(this).fadeIn(150);
        });

    });
    $(".navbar.visionMission").click(function(){
        $(this).parent().fadeOut(150, function(){
            $(this).find("div:eq(3)").load("visionMission.html");
            $("#mainWrapper").css("background-image","url(images/backVisionMission.png)");
             document.title = "Vision and Mission Statement | Vision/Mission | Ndoto - For Africa's Future";

            $(this).fadeIn(150);
        });

    });
    $(".navbar.donate").click(function(){
        $(this).parent().fadeOut(150, function(){
            $(this).find("div:eq(3)").load("donate.html");
            $("#mainWrapper").css("background-image","url(images/backDonate.png)");
             document.title ="Donate and help a Student | Donate | Ndoto - For Africa's Future";

            $(this).fadeIn(150, function(){});
        });

    });
});

Answer 2

我的猜测是 IE 中的排队功能不起作用。尝试将 fadeIn 调用放入 fadeOut 回调中，例如：

$(this).parent().fadeOut(150, function(){
    $(this).find("div:eq(3)").load("visionMission.html");
    $("#mainWrapper").css("background-image","url(images/backVisionMission.png)");
    $("title").html("Vision and Mission Statement | Vision/Mission | Ndoto - For Africa's Future");
    $(this).parent().fadeIn(150, function(){});
});

这可以防止在 fadeOut 完成之前进行 fadeIn 调用。这应该自动完成，但是，它是 IE...