JSLite - Ajax
如有疑問歡迎到這些地方交流,歡迎加入JSLite.io組織團(tuán)伙共同開發(fā)!
Ajax
執(zhí)行Ajax請求。請求地址可以是本地的或者跨域的,在支持的瀏覽器中通過 HTTP access control或者通過 JSONP來完成。
執(zhí)行Ajax請求。
type:請求方法 ("GET", "POST")
data:(默認(rèn):none)發(fā)送到服務(wù)器的數(shù)據(jù);如果是get請求,它會自動被作為參數(shù)拼接到url上。非String對象
processData (默認(rèn): true): 對于非Get請求。是否自動將 data 轉(zhuǎn)換為字符串。
dataType:(json
,jsonp
,xml
,html
, ortext
)
contentType:一個額外的"{鍵:值}"對映射到請求一起發(fā)送
headers:(默認(rèn):{}): 一個額外的"{鍵:值}"對映射到請求一起發(fā)送
url:發(fā)送請求的地址
async:此參數(shù)不傳默認(rèn)為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
$.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獨(dú)有....
$.ajax("GET", "http://127.0.0.1/api.php", {"wcj":"123","ok":'11'},function(cdata) { console.log("ok", cdata) })
2.通用調(diào)用方法
$.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){ ... })
$.getJSON("http://127.0.0.1/api.php", function(data){ console.log(data) })
jsonp
JSONP 方式
$.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])
$.post("http://127.0.0.1/api.php", {"nike":0},function(cdata) { console.log("ok", cdata) })
$.ajax(POST)
1.JSLite獨(dú)有....
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)用方法
$.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)容:
<h2>JSLite中AJAX的一個方法!</h2> <p id="demo">這是一個文本文件</p> // 把文件 "demo.txt" 的內(nèi)容加載到指定的 <div> 元素中 $("#div1").load("demo.txt"); //把 "demo.txt" 文件中 id="div1" 的元素的內(nèi)容,加載到指定的 <div> 元素中: $("#div1").load("demo.txt #p1");