jquery - 显示加载消息的 ajaxStart() 似乎不起作用

Question

我使用 jquery.ajax 调用 asp.net mvc 的控制器...我想显示一个加载指示器..我试过这个，但这似乎不起作用...

<div class="loading" style="padding-left:5px; margin-bottom:5px;display:none;">
      Loading...&nbsp
</div>

我的 jquery ajax 调用看起来像这样，

function getMaterials(currentPage) {
    $.ajax({
    url: "Materials/GetMaterials",
        data: {'currentPage': (currentPage + 1) ,'pageSize':5},
        contentType: "application/json; charset=utf-8",
        global: false,
        async: false,
        dataType: "json",
        success: function(data) {
            var divs = '';
            $("#ResultsDiv").empty();
            $.each(data.Results, function() {
                //my logic here....              
                $(".loading").bind("ajaxStart", function() {
                $(this).show();
                }).bind("ajaxStop", function() {
                $(this).hide();
                });
            }
    });
    return false;
}

我的加载指示器似乎没有出现..任何建议....

Answer 1

使用.ajax()你应该打电话：

beforeSend:  function(xmlHttpRequest){
    // show anything here
}

和

complete:  function(xmlHttpRequest, status){
    // hide it again
}

Answer 2

ajaxStartbeforeSend当我们发送带有 async: false 的 ajax 调用时，它确实适用于 Firefox，但不适用于所有浏览器（即 Safari）。我仍在寻找解决方法