JQuery的Ajax技术
jquery是一個(gè)優(yōu)秀的js框架，自然對(duì)js原生的ajax進(jìn)行了封裝，
封裝后的ajax的操作方法更簡(jiǎn)潔，功能更強(qiáng)大，與ajax操作
相關(guān)的jquery方法有如下幾種：
?
Ajax 請(qǐng)求
- $.ajax([options])
- load(url, [data], [callback])
- $.get(url, [data], [fn], [type])
- $.getJSON(url, [data], [fn])
- $.getScript(url, [callback])
但開(kāi)發(fā)中??? 經(jīng)常使用的有三種：
1）$.get(url, [data], [callback], [type])
2）$.post(url, [data], [callback], [type])
?
url：代表請(qǐng)求的服務(wù)器端地址
data：代表請(qǐng)求服務(wù)器端的數(shù)據(jù)（可以是key=value形式也可以是json格式）
callback：表示服務(wù)器端成功響應(yīng)所觸發(fā)的函數(shù)（只有正常成功返回才執(zhí)行）
type：表示服務(wù)器端返回的數(shù)據(jù)類型（jquery會(huì)根據(jù)指定的類型自動(dòng)類型轉(zhuǎn)換）
常用的返回類型：text、json、html等
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="jquery-1.11.3.min.js"></script> <script type="text/javascript">//get異步訪問(wèn)function fun1() {$.get("/WEB22/ajaxServlet1", //請(qǐng)求的web端的資源地址{"name" : "zhangsan","age" : 20}, //客戶端向服務(wù)器端發(fā)送的數(shù)據(jù)function(data) { //載入成功時(shí)的回調(diào)函數(shù),其中data是服務(wù)器返回給客戶端的數(shù)據(jù)alert(data.name);}, "json" //[type] 返回內(nèi)容的格式);}//post異步訪問(wèn)function fun2() {$.post("/WEB22/ajaxServlet1", //請(qǐng)求的web端的資源地址{"name" : "zhangsan","age" : 20}, //客戶端向服務(wù)器端發(fā)送的數(shù)據(jù)function(data) { //載入成功時(shí)的回調(diào)函數(shù),其中data是服務(wù)器返回給客戶端的數(shù)據(jù)alert(data.name);}, "json" //[type] 返回內(nèi)容的格式);} </script> </head><body><input type="button" value="get訪問(wèn)服務(wù)器端" οnclick="fun1()"><span id="span1"></span><br><input type="button" value="post訪問(wèn)服務(wù)器端" οnclick="fun2()"><span id="span2"></span><br> </body> </html>?
3）$.ajax( { option1:value1,option2:value2... } ); ---- 以后在掌握
常用的option有如下：
async：是否異步，默認(rèn)是true代表異步
data：發(fā)送到服務(wù)器的參數(shù)，建議使用json格式
dataType：服務(wù)器端返回的數(shù)據(jù)類型，常用text和json
success：成功響應(yīng)執(zhí)行的函數(shù)，對(duì)應(yīng)的類型是function類型
type：請(qǐng)求方式，POST/GET
url：請(qǐng)求服務(wù)器端地址
function fn3(){$.ajax({url:"/WEB22/ajaxServlet2",async:true,type:"POST",data:{"name":"lucy","age":18},success:function(data){alert(data.name);},error:function(){alert("請(qǐng)求失敗");},dataType:"json"});}
轉(zhuǎn)載于:https://www.cnblogs.com/houchen/p/10663484.html
總結(jié)
以上是生活随笔為你收集整理的JQuery的Ajax技术的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： Java基础7：关于Java类和包的那些
- 下一篇： 校验金额、大小写字母、大写字母、合法ur