此代码
$("#loading").ajaxStart(function() { alert("start"); $(this).show(); });
在我的标记中
<div style="text-align:center;"><img id="loading" src="../images/common/loading.gif" alt="" /></div>
这是完整的ajax请求:
$.ajax({ type: "POST", url: "http://localhost/WebServices/Service.asmx/GetResults", data: jsonText, contentType: "application/json; charset=utf-8", dataType: "json", success: function(response) { var results = (typeof response.d) == 'string' ? eval('(' + response.d + ')') : response.d; PopulateTree(results); }, error: function(xhr, status, error) { var msg = JSON.parse(xhr.responseText); alert(msg.Message); } }); $("#loading").ajaxStart(function() { alert("start"); $(this).show(); }); $("#loading").ajaxStop(function() { alert("stop"); $(this).hide(); $("#st-tree-container").show(); });
即使gif显示为旋转,也永远不会触发警报“开始”。AjaxStop如预期那样被触发。有什么想法吗?
之所以不会被触发,.ajaxStart()是因为直到ajax请求执行完 之后 (直到被调用时为止) , 您的处理程序才被注册。在.ajaxStop()被注册后为好,但 之前 的请求完成,所以当它回来就迷上了运行。
.ajaxStart()
.ajaxStop()
要解决此问题,请 在 首次$.ajax()致电 之前 将其移动:
$.ajax()
$("#loading").ajaxStart(function() { $(this).show(); }).ajaxStop(function() { $(this).hide(); $("#st-tree-container").show(); });
更新:从jQuery 1.9开始,AJAX事件应仅附加到文档。 http://jquery.com/upgrade- guide/1.9/#ajax-events-should-be-attached-to- document
$(document).ajaxStart(function() { $("#loading").show(); }); $(document).ajaxStop(function() { $("#loading").hide(); $("#st-tree-container").show(); });