主頁 > 知識庫 > 全面解析Ajax綜合應(yīng)用(全)

全面解析Ajax綜合應(yīng)用(全)

熱門標簽:Linux服務(wù)器 服務(wù)器配置 團購網(wǎng)站 Mysql連接數(shù)設(shè)置 阿里云 銀行業(yè)務(wù) 科大訊飛語音識別系統(tǒng) 電子圍欄

AJAX即“Asynchronous Javascript And XML”(異步JavaScript和XML),是指一種創(chuàng)建交互式網(wǎng)頁應(yīng)用的網(wǎng)頁開發(fā)技術(shù)。

AJAX = 異步 JavaScript和XML(標準通用標記語言的子集)。

AJAX 是一種用于創(chuàng)建快速動態(tài)網(wǎng)頁的技術(shù)。

通過在后臺與服務(wù)器進行少量數(shù)據(jù)交換,AJAX 可以使網(wǎng)頁實現(xiàn)異步更新。這意味著可以在不重新加載整個網(wǎng)頁的情況下,對網(wǎng)頁的某部分進行更新。

傳統(tǒng)的網(wǎng)頁(不使用 AJAX)如果需要更新內(nèi)容,必須重載整個網(wǎng)頁頁面。

•"xml": 返回 XML 文檔,可用 jQuery 處理。

•"html": 返回純文本 HTML 信息;包含的 script 標簽會在插入 dom 時執(zhí)行。

•"script": 返回純文本 JavaScript 代碼。不會自動緩存結(jié)果。除非設(shè)置了 "cache" 參數(shù)。注意:在遠程請求時(不在同一個域下),所有 POST 請求都將轉(zhuǎn)為 GET 請求。(因為將使用 DOM 的 script標簽來加載)

•"json": 返回 JSON 數(shù)據(jù) 。

•"jsonp": JSONP 格式。使用 JSONP 形式調(diào)用函數(shù)時,如 "myurl?callback=?" jQuery 將自動替換 ? 為正確的函數(shù)名,以執(zhí)行回調(diào)函數(shù)。

•"text": 返回純文本字符串

一、前臺傳遞字符串變量,后臺返回字符串變量(非json格式) 

  這里,為了解決Ajax數(shù)據(jù)傳遞出現(xiàn)的漢字亂碼,在字符串傳遞之前,使用javascript函數(shù)escape()對漢字字符串進行了編碼,并且對返回

的字符串使用unescape()函數(shù)進行解碼,使得漢字得以正常顯示。當(dāng)然了,后臺PHP代碼也添加了頭文件,以保證漢字字符串不會出現(xiàn)亂碼。各種后臺代碼解決

漢字亂碼問題的方式如下:

PHP:header('Content-Type:text/html;charset=GB2312');

 Javascript代碼:

$(function(){
var my_data="前臺變量";
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編碼,使中文不會變成亂碼
$backValue=$_POST['trans_data'];
echo $backValue."+后臺返回";

二、前臺傳遞多個一維數(shù)組,后臺返回字符串變量(非json格式)

  在非json格式下,后臺只能返回字符串,如果想后臺返回數(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,status){//如果調(diào)用php成功
alert(data);
}
});
});

PHP代碼:

//讀取第一個數(shù)組
$backValue="trans_data:";
$trans=$_POST['trans_data'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
//讀取第二個數(shù)組
$backValue=$backValue." , trans_data1:";
$trans=$_POST['trans_data1'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
echo $backValue;

三、前臺傳遞多個一維數(shù)組,后臺返回二維數(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編碼,使中文不會變成亂碼
$backValue=array();
$backValue[0]=$_POST['trans_data'];
$backValue[1]=$_POST['trans_data1'];
echo json_encode($backValue);

四、前臺傳遞一維數(shù)組和二維數(shù)組,后臺返回二維數(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編碼,使中文不會變成亂碼
$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 實現(xiàn)AJAX加載XML并解析的腳本
  • Jquery ajax不能解析json對象,報Invalid JSON錯誤的原因和解決方法
  • Javascript(AJAX)解析XML的代碼(兼容FIREFOX/IE)
  • jQuery Ajax使用 全解析
  • jQuery Ajax 實例全解析
  • 一步一步學(xué)asp.net Ajax登錄設(shè)計實現(xiàn)解析
  • jquery ajax請求實例深入解析
  • 淺析ajax請求json數(shù)據(jù)并用js解析(示例分析)

標簽:蚌埠 大理 萍鄉(xiāng) 廣元 棗莊 衡水 衢州 江蘇

巨人網(wǎng)絡(luò)通訊聲明:本文標題《全面解析Ajax綜合應(yīng)用(全)》,本文關(guān)鍵詞  ;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 收縮
    • 微信客服
    • 微信二維碼
    • 電話咨詢

    • 400-1100-266