JQuery的Ajax技术
生活随笔
收集整理的這篇文章主要介紹了
JQuery的Ajax技术
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
jquery是一個優秀的js框架，自然對js原生的ajax進行了封裝，
封裝后的ajax的操作方法更簡潔，功能更強大，與ajax操作
相關的jquery方法有如下幾種：
?
Ajax 請求
- $.ajax([options])
- load(url, [data], [callback])
- $.get(url, [data], [fn], [type])
- $.getJSON(url, [data], [fn])
- $.getScript(url, [callback])
但開發中??? 經常使用的有三種：
1）$.get(url, [data], [callback], [type])
2）$.post(url, [data], [callback], [type])
?
url：代表請求的服務器端地址
data：代表請求服務器端的數據（可以是key=value形式也可以是json格式）
callback：表示服務器端成功響應所觸發的函數（只有正常成功返回才執行）
type：表示服務器端返回的數據類型（jquery會根據指定的類型自動類型轉換）
常用的返回類型：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異步訪問function fun1() {$.get("/WEB22/ajaxServlet1", //請求的web端的資源地址{"name" : "zhangsan","age" : 20}, //客戶端向服務器端發送的數據function(data) { //載入成功時的回調函數,其中data是服務器返回給客戶端的數據alert(data.name);}, "json" //[type] 返回內容的格式);}//post異步訪問function fun2() {$.post("/WEB22/ajaxServlet1", //請求的web端的資源地址{"name" : "zhangsan","age" : 20}, //客戶端向服務器端發送的數據function(data) { //載入成功時的回調函數,其中data是服務器返回給客戶端的數據alert(data.name);}, "json" //[type] 返回內容的格式);} </script> </head><body><input type="button" value="get訪問服務器端" οnclick="fun1()"><span id="span1"></span><br><input type="button" value="post訪問服務器端" οnclick="fun2()"><span id="span2"></span><br> </body> </html>?
3）$.ajax( { option1:value1,option2:value2... } ); ---- 以后在掌握
常用的option有如下：
async：是否異步，默認是true代表異步
data：發送到服務器的參數，建議使用json格式
dataType：服務器端返回的數據類型，常用text和json
success：成功響應執行的函數，對應的類型是function類型
type：請求方式，POST/GET
url：請求服務器端地址
function fn3(){$.ajax({url:"/WEB22/ajaxServlet2",async:true,type:"POST",data:{"name":"lucy","age":18},success:function(data){alert(data.name);},error:function(){alert("請求失敗");},dataType:"json"});}
轉載于:https://www.cnblogs.com/houchen/p/10663484.html
總結
以上是生活随笔為你收集整理的JQuery的Ajax技术的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Java基础7：关于Java类和包的那些
- 下一篇： 校验金额、大小写字母、大写字母、合法ur