标签:
query中各个事件执行顺序如下:
1.ajaxStart(全局事件)
2.beforeSend(局部事件)
3.ajaxSend(全局事件)
4.success(局部事件)
5.ajaxSuccess(全局事件)
6.error(局部事件)
7.ajaxError (全局事件)
8.complete(局部事件)
9.ajaxComplete(全局事件)
10.ajaxStop(全局事件)
其中,全局事件可以在ajax相关方法外引用(比如,通过该方式将ajax执行各个阶段的信息显示在页面某个地方)。
下例演示一次ajax请求过程中各个事件执行的顺序,以及全局ajax的使用方法。
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 7 <script src="jquery-3.1.0.min.js"></script> 8 <script type="text/javascript"> 9 $(function() { 10 $("#ajaxReuqestID").click(function() { 11 $.ajax({ 12 url: "http://blog.csdn.net/gaoyusi4964238", 13 beforeSend: function() { 14 $("#ajaxStateID").text("berforeSend"); 15 alert("berforeSend"); 16 }, 17 success: function() { 18 $("#ajaxStateID").text("success"); 19 alert("success"); 20 }, 21 error: function() { 22 $("#ajaxStateID").text("error"); 23 alert("error"); 24 }, 25 complete: function() { 26 $("#ajaxStateID").text("complete"); 27 alert("complete"); 28 } 29 }); 30 }); 31 32 $("#ajaxStateID").ajaxStart(function() { 33 $(this).text("ajaxStart"); 34 alert("ajaxStart"); 35 }).ajaxSend(function() { 36 $(this).text("ajaxSend"); 37 alert("ajaxSend"); 38 }).ajaxSuccess(function() { 39 $(this).text("ajaxSuccess"); 40 alert("ajaxSuccess"); 41 }).ajaxError(function() { 42 $(this).text("ajaxError"); 43 alert("ajaxError"); 44 }).ajaxComplete(function() { 45 $(this).text("ajaxComplete"); 46 alert("ajaxComplete"); 47 }).ajaxStop(function() { 48 $(this).text("ajaxStop"); 49 alert("ajaxStop"); 50 }); 51 }) 52 </script> 53 </head> 54 55 <body> 56 <input type="button" value="点击触发ajax请求" id="ajaxReuqestID" /> 57 <div id="ajaxStateID"></div> 58 </body> 59 60 </html>
标签:
原文地址:http://www.cnblogs.com/m-liuy/p/5750939.html