JSLite - Ajax

**如有疑問歡迎到這些地方交流，歡迎加入JSLite.io組織團伙共同開發(fā)！** [](https://img.shields.io/github/forks/JSLite/JSLite.svg) [](https://github.com/JSLite/JSLite/stargazers) [](https://github.com/jaywcjlove/followers) [](https://github.com/JSLite/JSLite/issues) [](https://raw.githubusercontent.com/JSLite/JSLite/master/MIT-LICENSE) [](https://github.com/JSLite/JSLite/releases) [](https://travis-ci.org/JSLite/JSLite) [segmentfault社區(qū)](http://segmentfault.com/t/jslite/blogs) | [官方網(wǎng)站](http://jslite.io) | [官方文檔-更詳細](http://jslite.io/) | [Issues](https://github.com/JSLite/JSLite/issues) # Ajax 執(zhí)行Ajax請求。請求地址可以是本地的或者跨域的，在支持的瀏覽器中通過 [HTTP access control](https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS)或者通過 [JSONP](http://json-p.org/)來完成。 > 執(zhí)行Ajax請求。 > type：請求方法 ("GET", "POST") > data：(默認：none)發(fā)送到服務(wù)器的數(shù)據(jù)；如果是get請求，它會自動被作為參數(shù)拼接到url上。非String對象 > processData (默認： true)： 對于非Get請求。是否自動將 data 轉(zhuǎn)換為字符串。 > dataType：(`json`, `jsonp`, `xml`, `html`, or `text`) > contentType：一個額外的"{鍵:值}"對映射到請求一起發(fā)送 > headers：(默認：{})： 一個額外的"{鍵:值}"對映射到請求一起發(fā)送 > url：發(fā)送請求的地址 > async：此參數(shù)不傳默認為true(異步請求)，false同步請求 > success(cdata)：請求成功之后調(diào)用。傳入返回后的數(shù)據(jù)，以及包含成功代碼的字符串。 > error(status, statusText)：請求出錯時調(diào)用。 (超時，解析錯誤，或者狀態(tài)碼不在HTTP 2xx)。 ## $.get > $.get(url, function(data, status, xhr){ ... }) ? XMLHttpRequest > $.get(url, [data], [function(data, status, xhr){ ... }], [dataType]) ? XMLHttpRequest ```js $.get("http://127.0.0.1/api.php?wcj=123", function(cdata) { console.log("ok", cdata) },"json") $.get("http://127.0.0.1/api.php?wcj=123",{"JSLite":4}, function(cdata) { console.log("ok", cdata) }) ``` ## $.ajax(GET) 1.JSLite獨有.... ```js $.ajax("GET", "http://127.0.0.1/api.php", {"wcj":"123","ok":'11'},function(cdata) { console.log("ok", cdata) }) ``` 2.通用調(diào)用方法 ```js $.ajax({ type:"GET", dataType:"json", data:{"nike":"a"}, url:"http://127.0.0.1/api.php", success:function(data){ console.log("success:",data) }, error:function(d){ console.log("error:",d) } }) ``` ## $.getJSON 發(fā)送一個Ajax GET請求并解析返回的JSON數(shù)據(jù)。方法支持跨域請求。 $.getJSON(url, function(data, status, xhr){ ... }) ```js $.getJSON("http://127.0.0.1/api.php", function(data){ console.log(data) }) ``` ## jsonp JSONP 方式 ```js $.ajax({ url: "http://127.0.0.1/api.php?callback", dataType: "jsonp", success: function(data) { console.log(data) } }) $.ajax({ url: 'http://localhost/api3.php', dataType: "jsonp", success: function(data) { console.log("success:2:",data) }, error:function(d){ console.log("error:",d) } }) ``` ## $.post > $.post(url, [data], function(data, status, xhr){ ... }, [dataType]) ```js $.post("http://127.0.0.1/api.php", {"nike":0}, function(cdata) { console.log("ok", cdata) }) ``` ## $.ajax(POST) 1.JSLite獨有.... ```js var data = { "key": "key", "from": "from"} $.ajax("POST", "http://127.0.0.1/api.php", data,function(data) { console.log("ok", data) },"json") ``` 2.通用調(diào)用方法 ```js $.ajax({ type:"POST", dataType:"json", data:{"nike":"123","kacper":{"go":34,"to":100}}, url:"http://127.0.0.1/api.php", success:function(data){ console.log("success:",data) }, error:function(d){ console.log("error:",d) } }) $.ajax({ type:"POST", dataType:"json", data:JSON.stringify("{"nike":"123","kacper":{"go":34,"to":100}}"), url:"http://127.0.0.1/api.php", success:function(data){ console.log("success:",data) }, error:function(d){ console.log("error:",d) } }) $.ajax({ type:"POST", dataType:"json", data:JSON.stringify({"nike":"a"}), url:"http://127.0.0.1/api.php", success:function(data){ console.log("success:",data) }, error:function(d){ console.log("error:",d) } }) $.ajax({ type:"POST", data:{"nike":"a"}, url:"http://127.0.0.1/api.php", success:function(data){ console.log("success:",data) }, error:function(d){ console.log("error:",d) } }) $.ajax({ type:"POST", dataType:"json", data:{"nike":"a"}, url:"http://127.0.0.1/api.php", success:function(data){ console.log("success:",data) }, error:function(d){ console.log("error:",d) }, headers: { "Access-Control-Allow-Origin":"http://pc175.com", "Access-Control-Allow-Headers":"X-Requested-With" }, contentType: "application/json" }) ``` ## $.ajaxJSONP 已過時，使用 `$.ajax` 代替。此方法相對 `$.ajax` 沒有優(yōu)勢，建議不要使用。 $.ajaxJSONP(options) ? 模擬 XMLHttpRequest ## load > load() 方法從服務(wù)器加載數(shù)據(jù)，并把返回的數(shù)據(jù)放入被選元素中。 $(selector).load(URL,data,callback); 必需的 `URL` 參數(shù)規(guī)定您希望加載的 URL。 可選的 `data` 參數(shù)規(guī)定與請求一同發(fā)送的查詢字符串鍵/值對集合。 可選的 `callback` 參數(shù)是 `load()` 方法完成后所執(zhí)行的函數(shù)名稱。 這是示例文件（"demo.txt"）的內(nèi)容： ```html

JSLite中AJAX的一個方法！

這是一個文本文件

``` ```js // 把文件 "demo.txt" 的內(nèi)容加載到指定的