jquery - 如何调用jquery ajaxStart + ajaxComplete

Question

我有一个加载函数，希望代码在加载时将一些 html 写入 div，并在加载完成时显示页面。我看到了一些关于 ajaxStart 和 ajaxComplete 事件的小文章，但是我不确定如何实现它们。

这是我正在考虑使用的 jQuery，但不确定如何在我当前的代码中实现......

$(document).ajaxStart(function(){ 
    $('#content').html("Loading Content...");
});

这是我当前使用的 jQuery:

//Load content
$(".load").click(function(){
    $("#content").empty();           
    loadName = $(this).attr("id");
    $("#content").load("/content/" + loadName + ".php");
});

Answer 1

如果它是单个 div 并且您想使用加载消息/指示器更新其内容，您可以这样做:

$("#content").html('<strong>Loading...</strong>')
             .load("/content/" + loadName + ".php");

我不会使用 ajaxStart 和 ajaxStop/ajaxComplete global events除非您对所有 ajax 调用都有一个通用的加载指示器。也就是说，可以按如下方式完成:

$("#loading").bind("ajaxStart", function(){
    $(this).show();
}).bind("ajaxStop", function(){
    $(this).hide();
});

其中 loading 元素是您想要在 ajax 调用期间显示的内容。