AJAX即“Asynchronous Javascript And XML”（異步JavaScript和XML），是指一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開(kāi)發(fā)技術(shù)。
AJAX = 異步 JavaScript和XML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的子集）。
AJAX 是一種用于創(chuàng)建快速動(dòng)態(tài)網(wǎng)頁(yè)的技術(shù)。
通過(guò)在后臺(tái)與服務(wù)器進(jìn)行少量數(shù)據(jù)交換，AJAX 可以使網(wǎng)頁(yè)實(shí)現(xiàn)異步更新。這意味著可以在不重新加載整個(gè)網(wǎng)頁(yè)的情況下，對(duì)網(wǎng)頁(yè)的某部分進(jìn)行更新。
傳統(tǒng)的網(wǎng)頁(yè)（不使用 AJAX）如果需要更新內(nèi)容，必須重載整個(gè)網(wǎng)頁(yè)頁(yè)面。
•"xml": 返回 XML 文檔，可用 jQuery 處理。
•"html": 返回純文本 HTML 信息；包含的 script 標(biāo)簽會(huì)在插入 dom 時(shí)執(zhí)行。
•"script": 返回純文本 JavaScript 代碼。不會(huì)自動(dòng)緩存結(jié)果。除非設(shè)置了 "cache" 參數(shù)。注意：在遠(yuǎn)程請(qǐng)求時(shí)(不在同一個(gè)域下)，所有 POST 請(qǐng)求都將轉(zhuǎn)為 GET 請(qǐng)求。（因?yàn)閷⑹褂?DOM 的 script標(biāo)簽來(lái)加載）
•"json": 返回 JSON 數(shù)據(jù) 。
•"jsonp": JSONP 格式。使用 JSONP 形式調(diào)用函數(shù)時(shí)，如 "myurl?callback=?" jQuery 將自動(dòng)替換 ? 為正確的函數(shù)名，以執(zhí)行回調(diào)函數(shù)。
•"text": 返回純文本字符串
一、前臺(tái)傳遞字符串變量，后臺(tái)返回字符串變量（非json格式）
這里，為了解決Ajax數(shù)據(jù)傳遞出現(xiàn)的漢字亂碼，在字符串傳遞之前，使用javascript函數(shù)escape()對(duì)漢字字符串進(jìn)行了編碼，并且對(duì)返回
的字符串使用unescape()函數(shù)進(jìn)行解碼，使得漢字得以正常顯示。當(dāng)然了，后臺(tái)PHP代碼也添加了頭文件，以保證漢字字符串不會(huì)出現(xiàn)亂碼。各種后臺(tái)代碼解決
漢字亂碼問(wèn)題的方式如下：
PHP:header('Content-Type:text/html;charset=GB2312');
Javascript代碼：
$(function(){
var my_data="前臺(tái)變量";
my_data=escape(my_data)+"";//編碼，防止?jié)h字亂碼
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data},
//dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data,status){//如果調(diào)用php成功
alert(unescape(data));//解碼，顯示漢字
}
});
});
PHP代碼：
header('Content-Type:text/html; charset=gb2312');//使用gb2312編碼，使中文不會(huì)變成亂碼
$backValue=$_POST['trans_data'];
echo $backValue."+后臺(tái)返回";
二、前臺(tái)傳遞多個(gè)一維數(shù)組，后臺(tái)返回字符串變量（非json格式）
在非json格式下，后臺(tái)只能返回字符串，如果想后臺(tái)返回?cái)?shù)組，可以采用json格式，在本文的后面會(huì)詳細(xì)介紹。
Javascript代碼：
$(function(){
var my_data=new Array();
var my_data1=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1},
//dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data,status){//如果調(diào)用php成功
alert(data);
}
});
});
PHP代碼：
//讀取第一個(gè)數(shù)組
$backValue="trans_data:";
$trans=$_POST['trans_data'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
//讀取第二個(gè)數(shù)組
$backValue=$backValue." , trans_data1:";
$trans=$_POST['trans_data1'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
echo $backValue;
三、前臺(tái)傳遞多個(gè)一維數(shù)組，后臺(tái)返回二維數(shù)組（json格式）
Javascript代碼：
$(function(){
var my_data=new Array();
var my_data1=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1},
dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data){//如果調(diào)用php成功
}
alert(back);
}
});
});
PHP代碼：
header('Content-Type:text/html; charset=gb2312');//使用gb2312編碼，使中文不會(huì)變成亂碼
$backValue=array();
$backValue[0]=$_POST['trans_data'];
$backValue[1]=$_POST['trans_data1'];
echo json_encode($backValue);
四、前臺(tái)傳遞一維數(shù)組和二維數(shù)組，后臺(tái)返回二維數(shù)組（json格式）
Javascript代碼：
$(function(){
var my_data=new Array();
var my_data1=new Array();
var my_data2=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
my_data2[0]=my_data;
my_data2[1]=my_data1;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1,trans_data2:my_data2},
dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data){//如果調(diào)用php成功
}
alert(back);
}
});
});
PHP代碼：
header('Content-Type:text/html; charset=gb2312');//使用gb2312編碼，使中文不會(huì)變成亂碼
$backValue=array();
$backValue=$_POST['trans_data2'];
$backValue[2]=$_POST['trans_data'];
$backValue[3]=$_POST['trans_data1'];
echo json_encode($backValue);
以上內(nèi)容是小編給大家介紹的全面解析Ajax綜合應(yīng)用大全，希望能夠幫助到大家！
您可能感興趣的文章:- AJAX的阻塞及跨域名解析
- jQuery Ajax 全解析
- 用JQuery 實(shí)現(xiàn)AJAX加載XML并解析的腳本
- Jquery ajax不能解析json對(duì)象，報(bào)Invalid JSON錯(cuò)誤的原因和解決方法
- Javascript(AJAX)解析XML的代碼(兼容FIREFOX/IE)
- jQuery Ajax使用 全解析
- jQuery Ajax 實(shí)例全解析
- 一步一步學(xué)asp.net Ajax登錄設(shè)計(jì)實(shí)現(xiàn)解析
- jquery ajax請(qǐng)求實(shí)例深入解析
- 淺析ajax請(qǐng)求json數(shù)據(jù)并用js解析(示例分析)
