基於jquery的ajax封裝

2021-07-17 04:29:51 字數 1488 閱讀 4891

jquery給我們的開發帶來了很多的便利,對其熟練的運用是現在前端開發人員的必要技能之一。其封裝的很多方法都做了相容的處理,就少去了部分開發人員做相容處理的問題,從而提高工作效率,有更多時間來學習其它技能…

今天來聊聊其的ajax()方法,ajax() 方法通過 http 請求載入遠端資料。$.ajax() 返回其建立的 xmlhttprequest 物件。大多數情況下你無需直接操作該函式,除非你需要操作不常用的選項,以獲得更多的靈活性。

一般的ajax請求例項:

$.ajax(,

error:function

(err)

});

引數說明:

問題初見:今天工作時乙個頁面需要呼叫到5個介面,寫之前用到上面的例項,啪啪啪~一穀腦寫出來請求的引數ctrl+c,ctrl+v,後來寫完發現畢樂苟好多重複的引數,看著好不爽=。=,沒辦法簡化唄,怎麼優化呢?寫方法呼叫?jquery的ajax方法封裝了還要寫方法?用原生封裝?太麻煩!不考慮。

問題解決:

//  基於jquery的ajax封裝

function readajax(url, data, async, type, datatype, successfn, errorfn)

$.ajax(,

error: function(e)

});

}

呼叫:

var data = ;  //介面需要的請求引數object

readajax(url,data,null,null,null,function

(data),function

( //錯誤

));

這個封裝可能還不夠完善,需要更多的引數時需要增減。

高階選項(ps:從未使用)

ajax 的第乙個字母是 asynchronous 的開頭字母,這意味著所有的操作都是並行的,完成的順序沒有前後關係。.a

jax(

)的as

ync參

數總是設

置成tr

ue,這

標誌著在

請求開始

後,其他

**依然

能夠執行

。強烈不

建議把這

個選項設

置成fa

lse,

這意味著

所有的請

求都不再

是非同步的

了,這也

會導致瀏

覽器被鎖

死。.ajax 函式返回它建立的 xmlhttprequest 物件。通常 jquery 只在內部處理並建立這個物件,但使用者也可以通過 xhr 選項來傳遞乙個自己建立的 xhr 物件。返回的物件通常已經被丟棄了,但依然提供乙個底層介面來觀察和操控請求。比如說,呼叫物件上的 .abort() 可以在請求完成前掛起請求。

活到老學到老,學到老活到老。一直致力於前端的學習,完成頁面仔的逆襲,這就是我!

封裝通用的 ajax, 基於 jQuery。

在前端非同步獲取資料時候每次都是使用 ajax 為了通用性更好,然而封裝通用的 ajax 是乙個一勞永逸的辦法。本次基於 jquery 封裝實現 第一步 引入 jquery 第二步 實現 該封裝基於 jquery var sendajax function method,url,data,succe...

jQuery封裝ajax的方法

引數有4個,必填引數是url位址,其他引數都是選填引數,可以沒有,引數的形式是物件形式。get 引數有4個,必填引數是url位址,其他引數都是選填引數,可以沒有,引數的形式是物件形式。post 請求成功時執行的函式 有n個引數,預設請求方式是 get 方式 ajax 傳參引數,必須是物件形式,dat...

jQuery封裝ajax的方法

最近在逆戰班學習了jquery,這裡學一些jquery封裝ajax的方法,jquery封裝ajax原理和原生js是一樣的,只是用的是封裝好的方法,具體有三種方式。1,get 方法 從字面意義就可以看出是get請求方法 有4個引數,必填引數是 url位址 其他引數都是選填引數,可以沒有 引數的形式是物...