Jquery 如何使用.load和.fadeIn更改DIV内容？

我正在尝试使用以下命令更改Div的内容：

$('#content').click(function() {
    $('#content').fadeOut().load('about.php').fadeIn('normal');
});

但它总是闪烁，我不知道如何解决它，因为我对jQuery有点缺乏经验

---

我在这里看了同一个问题，我尝试了选择的答案，但没有结果。

您可以这样做：

$('#content').click(function(){
  $('#content').fadeOut(function(){
     $('#content').load('about.php').fadeIn('normal');
  });
});

---

使用

load

作为

fadeOut

的

回调

，您应该使用

.fadeOut（）

和

.load（）

函数的回调函数。目前，您正在淡出，添加HTML，然后同时淡入所有内容

试试看：

//add event handler to click event for the #content element
$('#content').click(function() {

    //cache this element
    var $this = $(this);

    //fadeOut the element
    $this.fadeOut(function () {

        //after fadeOut is done, change it's HTML
        $this.load('about.php', function () {

            //now fadeIn the new HTML, this is in the callback for the `.load()`
            //function because `.load()` is an asynchronous function
            $this.fadeIn();
        });
    });
});

我之所以嵌套所有的

回调

函数，是为了在运行下一个进程之前完成每个进程。首先允许

.fadeOut（）

完成，然后允许

.load（）

获取数据并将其放置在DOM中，然后使用新HTML创建元素