php - JQuery.Post() 的用途和区别

Question

在网站上工作时，我有一个内容区域划分，我想根据我点击的图像更新其内容。现在，我有一个在内容区域中使用的自定义滚动条。现在，我首先为 onclick 脚本函数编写了以下代码段:

function xyz(){
    $("#content-area").load("abc.php");
    $("#content-area").mCustomScrollbar({scrollButtons:{enable:true}});
}

但是脚本的第二行没有响应，即我没有得到滚动条。相反，当我使用这段代码片段时，它起作用了:

$.post("abc.php", function(data){
   $("#content-area").html(data);
   $("#content-area").mCustomScrollbar({scrollButtons:{enable:true}});
});

我想知道 $.post() 的功能以及为什么第一个代码段不起作用而第二个代码段起作用？

Answer 1

在 mCustomScrollbar 将在 AJAX 请求发送后立即执行的第一种情况:记住，AJAX 中的第一个 A 是 异步。但它显然还没有任何工作要做，因为服务器的响应还没有出现。

在第二个片段中，mCustomScrollbar 小部件创建发生在 收到 AJAX 请求的响应之后(因为这一行是 $.post 的一部分)现在成功处理程序)和#content-area 填充了必要的结构(使用.html())调用。所以现在它可以正常工作了。

您可以使用 $.load 方法可以提供自定义回调函数，该函数将在请求完成时执行，如 here 所述。 .例如:

$("#content-area").load("abc.php", function() {
     $(this).mCustomScrollbar({scrollButtons:{enable:true}});
});

注意 $(this) 用法:因为 this 在回调函数中依次设置到每个 DOM 元素，所以您不需要遍历 DOM 来查看再次为那个content-area；只需将该元素包装到 jQuery 对象中就足够了。