當前位置：
首頁 >
036_jQuery Ajax全局回调函数
發布時間：2025/4/17
55
豆豆
生活随笔
收集整理的這篇文章主要介紹了
036_jQuery Ajax全局回调函数
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1. ajaxStart()方法
1.1. ajaxStart()方法在AJAX請求發送前執行函數。
1.2. 語法
$(selector).ajaxStart(function(even))1.3. 參數
2. ajaxSend()方法
2.1. ajaxSend()方法在AJAX請求開始時執行函數。
2.2. 語法
$(selector).ajaxSend(function(even,jqXHR,options))2.3. 參數
3. ajaxSuccess()方法
3.1. ajaxSuccess()方法在AJAX請求成功時執行函數。
3.2. 語法
$(selector).ajaxSuccess(function(even,jqXHR,options,response))3.3. 參數
4. ajaxError()方法
4.1. ajaxError()方法在AJAX請求發生錯誤時執行函數。
4.2. 語法
$(selector).ajaxError(function(even,jqXHR,options,error))4.3. 參數
5. ajaxComplete()方法
5.1. ajaxComplete()方法在AJAX請求完成時執行函數。
5.2. 語法
$(selector).jQueryajaxComplete(function(even,jqXHR,options))5.3. 參數
6. ajaxStop()方法
6.1. ajaxStop()方法在AJAX請求結束時執行函數。
6.2. 語法
$(selector).ajaxStop(function(even))6.3. 參數
7. 6個全局回調函數的運行順序
7.1. 6個全局回調函數的運行順序是: ajaxStart()、ajaxSend()、ajaxSuccess()/ajaxError()、ajaxComplete()和ajaxStop()。
8. 例子
8.1. 新建一個名為jQueryAjaxGlobalFunction動態WEB工程
8.2. 新建test.json
{"data": {"code": 1, "info": "success", "msg": "請求成功。"}}8.3. 新建test.xml
<?xml version="1.0" encoding="UTF-8"?> <data><code>1</code><info>success</info><msg>請求成功。</msg> </data>8.4. 新建index.html
<!DOCTYPE html> <html><head><title>jQuery-Ajax的全局回調函數</title><meta charset="utf-8" /><script type="text/javascript" src="jquery.js"></script><script type="text/javascript">$(document).ready(function(){$(this).ajaxStart(function(even){console.log('-------ajaxStart Start-------------');for(var i = 0; i < arguments.length; i++){console.log(arguments[i]);} console.log('-------ajaxStart End-------------'); }).ajaxSend(function(even, jqXHR, options){console.log('-------ajaxSend Start-------------');for(var i = 0; i < arguments.length; i++){console.log(arguments[i]);} console.log('-------ajaxSend End-------------'); }).ajaxSuccess(function(even, jqXHR, options, response){console.log('-------ajaxSuccess Start-------------');for(var i = 0; i < arguments.length; i++){console.log(arguments[i]);} console.log('-------ajaxSuccess End-------------'); }).ajaxError(function(even, jqXHR, options, error){console.log('-------ajaxError Start-------------');for(var i = 0; i < arguments.length; i++){console.log(arguments[i]);} console.log('-------ajaxError End-------------'); }).ajaxComplete(function(even, jqXHR, options){console.log('-------ajaxComplete Start-------------');for(var i = 0; i < arguments.length; i++){console.log(arguments[i]);} console.log('-------ajaxComplete End-------------'); }).ajaxStop(function(even){console.log('-------ajaxStop Start-------------');for(var i = 0; i < arguments.length; i++){console.log(arguments[i]);} console.log('-------ajaxStop End-------------'); });$('#btn1').click(function(){$.get('test.json');});$('#btn2').click(function(){$.post('test.xml');});$('#btn3').click(function(){$("#result").load("test.json");});$('#btn4').click(function(){$.ajax({url: 'test.xml',dataType: 'xml',cache: false});});});</script><style type="text/css">div {width: 450px;height: 100px;background-color: pink;}</style></head><body> <div id="result">結果區域</div><br /><button id="btn1">get test.json</button> <button id="btn2">post test.xml</button><br /><br /><button id="btn3">load test.json</button> <button id="btn4">ajax test.xml</button></body> </html>8.5. 運行項目
《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀總結
以上是生活随笔為你收集整理的036_jQuery Ajax全局回调函数的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 035_jQuery Ajax的ajax
- 下一篇： 037_jQuery Ajax序列化