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}}); 
}); 

我想知道的$。员额（），为什么第一个片段没有工作的功能，而第二个片段工作？

Answer 1

在第一种情况即mCustomScrollbar将被执行之后AJAX请求是发送：记得，第一A在AJAX为asynchronous。但它显然没有任何工作，因为回应从服务器尚未在这里。

在第二个片段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对象就足够了。

Answer 2

我想，在第一实例的第二发言正在​​功能的完成之前执行。在第二种情况下，您正确使用了成功功能，该功能仅在完成POST请求后执行。

Answer 3

您需要使用它时，请求完成执行回调函数：

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