簡(jiǎn)單理解jQuery中
.get万伤、
.ajax用法
在WEB開發(fā)中異步請(qǐng)求方式普遍使用纠拔，ajax技術(shù)減少程序員的工作量缸血，也提升用戶交互體驗(yàn)蜜氨。AJAX的四種異步請(qǐng)求方式都能實(shí)現(xiàn)基本需求，閑話不多說(shuō)捎泻，直接切入正題飒炎。
1.$.getJSON
$.getJSON()是專門為ajax獲取json數(shù)據(jù)而設(shè)置的，并且支持跨域調(diào)用笆豁，其語(yǔ)法的格式為：
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">1 $.getJSON( 2 url, //請(qǐng)求URL
3 [data], //傳參郎汪，可選參數(shù)
4 [callback] //回調(diào)函數(shù)赤赊，可選參數(shù)
5 ); </pre>
url：string類型， 發(fā)送請(qǐng)求地址
data ：可選參數(shù)煞赢， 待發(fā)送 Key/value 參數(shù) 抛计，同get，post類型的data
callback ：可選參數(shù)照筑，載入成功時(shí)回調(diào)函數(shù)吹截，同get，post類型的callback
JSON是一種理想的數(shù)據(jù)傳輸格式凝危，它能夠很好的融合與JavaScript或其他宿主語(yǔ)言波俄，并且可以被JS直接使用。使用JSON相比傳統(tǒng)的通過(guò) GET蛾默、POST直接發(fā)送“裸體”數(shù)據(jù)懦铺，在結(jié)構(gòu)上更為合理，也更為安全支鸡。至于jQuery的getJSON()函數(shù)冬念，只是設(shè)置了JSON參數(shù)的 ajax()函數(shù)的一個(gè)簡(jiǎn)化版本。這個(gè)函數(shù)也是可以跨域使用的牧挣，相比get()急前、post()有一定優(yōu)勢(shì)。另外這個(gè)函數(shù)可以通過(guò)把請(qǐng)求url寫 成"myurl?callback=X"這種格式浸踩，讓程序執(zhí)行回調(diào)函數(shù)X叔汁。
特別注意：.post。至于如何修改為可用POST方式提交或者擴(kuò)大GET提交數(shù)據(jù)量的問(wèn)題码邻，沒(méi)有深入研究折剃。
](javascript:void(0); "復(fù)制代碼")
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"> 1 //——項(xiàng)目中的實(shí)際案例
2 function changeAnswerShow(id){ 3 ("td.show"+id+" a i" ); 10 if(i.hasClass("splashy-gem_okay")){ 11 i.removeClass("splashy-gem_okay").addClass("splashy-gem_remove"); 12 }else{ 13 i.removeClass("splashy-gem_remove").addClass("splashy-gem_okay"); 14 } 15 return true; 16 }else{ 17 showErrorMessage(data.error); 18 return false; 19 } 20 } 21 ); 22 }</pre>
](javascript:void(0); "復(fù)制代碼")
2.$.get
** .getJSON完全滿足功能需要阵子，正如上所說(shuō)，結(jié)構(gòu)合理胜蛉、更加安全挠进。即便是為了提交長(zhǎng)數(shù)據(jù)色乾，也不會(huì)選用
.post。但還是要了解其 用法：
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">1 $.get( 2 url, 3 [data], 4 [ callback] 5 ;)</pre>
url：string類型领突，ajax請(qǐng)求的地址暖璧。
data：可選參數(shù)，object類型君旦，發(fā)送至服務(wù)器的key/value數(shù)據(jù)會(huì)作為QueryString附加到請(qǐng)求URL中澎办。
callback：可選參數(shù)，function類型金砍，當(dāng)ajax返回成功時(shí)自動(dòng)調(diào)用該函數(shù)局蚀。
[
](javascript:void(0); "復(fù)制代碼")
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"> 1 //項(xiàng)目案例
2 ("#focus_"+id).text();
8 su=parseInt(su);
9 su++; 10 ("#show_"+id); 12 var j=$("<span><p class='icon-ok'></p>已贊同</span>"); 13 i.empty().append(j); 14 return true; 15 }else{ 16 showError(data.error); //調(diào)用其它函數(shù)捞魁，讀者可忽視 17 return false; 18 } 19 } 20 );</pre>
](javascript:void(0); "復(fù)制代碼")
3.$.post
我在提交評(píng)論或者留言之類的數(shù)據(jù)時(shí)經(jīng)常使用$.post,不廢話上代碼：
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">1 $.post( 2 url, 3 [data], 4 [callback], 5 [type] 6 );</pre>
url：string類型至会，ajax請(qǐng)求的地址。
data：可選參數(shù)谱俭，object類型奉件，發(fā)送至服務(wù)器的key/value數(shù)據(jù)會(huì)作為QueryString附加到請(qǐng)求URL中。
callback：可選參數(shù)昆著，function類型县貌，當(dāng)ajax返回成功時(shí)自動(dòng)調(diào)用該函數(shù)。
type：type為請(qǐng)求的數(shù)據(jù)類型凑懂，可以是html,xml,json等類型煤痕，如果我們?cè)O(shè)置這個(gè)參數(shù)為：json，那么返回的格式則是json格式的接谨，如果沒(méi)有設(shè)置摆碉，就和$.get()返回的格式一樣，都是字符串的脓豪。
這個(gè)方法和.get()的楞泼。
](javascript:void(0); "復(fù)制代碼")
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"> 1 //實(shí)際項(xiàng)目案例
2 function changeMarkShow(id){ 3 ("td.markshow"+id+" a i" ); 10 if(i.hasClass("splashy-star_full")){ 11 i.removeClass("splashy-star_full").addClass("splashy-gem_empty"); 12 }else{ 13 i.removeClass("splashy-gem_empty").addClass("splashy-gem_full"); 14 } 15 return true; 16 }else{ 17 showErrorMessage(data.error); 18 return false; 19 } 20 }, 21 "json" //聲明數(shù)據(jù)格式
22 ); 23 }</pre>
](javascript:void(0); "復(fù)制代碼")
4.$.ajax
$.ajax是一種常用的普通封裝異步方式颗味。
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">1 $.ajax(options)超陆；</pre>
options是一個(gè)object類型，它指明了本次ajax調(diào)用的具體參數(shù)脱衙。呈上代碼：
[
](javascript:void(0); "復(fù)制代碼")
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"> 1 //示例
2 .ajax(
3 url: "/legalconsult/layer/update-info",
4 datatype:"json",
5 type:'post',
6 beforeSend:function(){
7 //函數(shù)體侥猬，數(shù)據(jù)發(fā)送前執(zhí)行例驹。
8 }
9 success：function(){ 10 //函數(shù)體，數(shù)據(jù)發(fā)送成功回調(diào)
11 } 12 error: function(){ 13 //函數(shù)體退唠，數(shù)據(jù)發(fā)送錯(cuò)誤時(shí)執(zhí)行
14 } 15 ); </pre>
](javascript:void(0); "復(fù)制代碼")
以上是我在做項(xiàng)目時(shí)遇到出問(wèn)題時(shí)鹃锈，通過(guò)查資料、測(cè)試得出的可行性方法瞧预；希望對(duì)你有所幫助~~
