AJAX = 非同步 JavaScript 和 XML，AJAX 是一種用於建立快速動態網頁的技術。本文為大家帶來了全面解析Ajax綜合應用大全，非常不錯具有參考借鑒價值，有興趣的朋友一起看下吧
AJAX即「Asynchronous Javascript And XML」（非同步JavaScript和XML），是指一種創建互動式網頁應用的網頁開發技術。
AJAX = 非同步 JavaScript和XML（標準通用標記語言的子集）。
AJAX 是一種用於建立快速動態網頁的技術。
透過在後台與伺服器進行少量資料交換，AJAX 可以使網頁實現非同步更新。這意味著可以在不重新載入整個網頁的情況下，對網頁的某個部分進行更新。
傳統的網頁（不使用 AJAX）如果需要更新內容，必須重載整個網頁頁面。
•"xml": 傳回 XML 文檔，可用 jQuery 處理。
•"html": 傳回純文字 HTML 資訊；所包含的 script 標籤會在插入 dom 時執行。
•"script": 傳回純文字 JavaScript 程式碼。不會自動快取結果。除非設定了 "cache" 參數。注意：在遠端請求時(不在同一個網域下)，所有 POST 請求都會轉為 GET 請求。 （因為將使用 DOM 的 script標籤來載入）
•"json": 傳回 JSON 資料 。
•"jsonp": JSONP 格式。使用 JSONP 形式呼叫函數時，如 "myurl?callback=?" jQuery 會自動取代 ? 為正確的函式名，以執行回呼函數。
•"text": 傳回純文字字串
一、前台傳遞字串變量，後台傳回字串變數（非json格式）
這裡，為了解決Ajax資料傳遞出現的漢字亂碼，在字串傳遞之前，使用javascript函數escape()對漢字字串進行了編碼，並且對返回
的字串使用unescape()函數進行解碼，使得漢字得以正常顯示。當然了，後台PHP程式碼也加入了頭文件，以確保漢字字串不會出現亂碼。各種後台程式碼解決
漢字亂碼問題的方式如下：
PHP:
header('Content-Type:text/html;charset=GB2312');
Javascript程式碼：
$(function(){
var my_data="前台变量";
my_data=escape(my_data)+"";//编码，防止汉字乱码
$.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){//如果调用php成功
alert(unescape(data));//解码，显示汉字
}
});
});PHP程式碼：
#header('Content-Type:text/html; charset=gb2312');//使用gb2312编码，使中文不会变成乱码 $backValue=$_POST['trans_data']; echo $backValue."+后台返回";
##二、前台傳遞多個一維數組，後台傳回字串變數（非json格式）
在非json格式下，後台只能傳回字串，如果想後台回傳數組，可以採用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,status){//如果调用php成功
alert(data);
}
});
});PHP程式碼：
//读取第一个数组
$backValue="trans_data:";
$trans=$_POST['trans_data'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
//读取第二个数组
$backValue=$backValue." , trans_data1:";
$trans=$_POST['trans_data1'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
echo $backValue;三、前台傳遞多個一維數組，後台返回二維數組（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){//如果调用php成功
}
alert(back);
}
});
});# PHP程式碼：
##header('Content-Type:text/html; charset=gb2312');//使用gb2312编码，使中文不会变成乱码 $backValue=array(); $backValue[0]=$_POST['trans_data']; $backValue[1]=$_POST['trans_data1']; echo json_encode($backValue);
#四、前台傳遞一維數組和二維數組，後台返回二維數組（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){//如果调用php成功
}
alert(back);
}
});
});header('Content-Type:text/html; charset=gb2312');//使用gb2312编码，使中文不会变成乱码 $backValue=array(); $backValue=$_POST['trans_data2']; $backValue[2]=$_POST['trans_data']; $backValue[3]=$_POST['trans_data1']; echo json_encode($backValue);
使用Nginx 反向代理來避免ajax 跨域請求的方法
以上是全面解析Ajax綜合應用的詳細內容。更多資訊請關注PHP中文網其他相關文章！
