Ajax技術(shù)是最近一個(gè)比較熱門(mén)的話題,有很多人追捧,也有人對(duì)此不屑,在此我就不多講理論上的。僅談?wù)勎以趐hp下用sajax.php進(jìn)行ajax開(kāi)發(fā)的經(jīng)驗(yàn)
在制作之前,大家不放先到這里去下載一個(gè)ZIP包。
http://www.modernmethod.com/sajax/download.phtml 下載后,我們要用到其中的Sajax.php那個(gè)關(guān)鍵的文件。制作Ajax技術(shù)的PHP網(wǎng)頁(yè),我們要設(shè)計(jì)3個(gè)部分的內(nèi)容。
1、PHP的函數(shù)
在下載的ZIP包中,大家應(yīng)該可以看到那個(gè)乘法運(yùn)算的例程。在此步驟中我們把要在PHP代碼中處理的事情寫(xiě)在一個(gè)函數(shù)中。
PHP代碼:
function multiply($x, $y) {
return $x * $y;
}
此函數(shù)很簡(jiǎn)單,大家都看得懂吧,就是做一個(gè)乘法運(yùn)算而已。
2、HTML的Input
作為一個(gè)乘法運(yùn)算,自然而然的要在頁(yè)面中顯示幾個(gè)Input,讓用戶輸入數(shù)字。因此,我們寫(xiě)出如下代碼。
代碼:
<input type=\"text\" name=\"x\" id=\"x\" value=\"2\" size=\"3\">*
<input type=\"text\" name=\"y\" id=\"y\" value=\"3\" size=\"3\">
=
<input type=\"text\" name=\"z\" id=\"z\" value=\"\" size=\"3\">
<input type=\"button\" name=\"check\" value=\"Calculate\"
onclick=\"do_multiply(); return false;\">
由此可以看出,這里有3個(gè)text,一個(gè)x,一個(gè)y,作為運(yùn)算的2個(gè)數(shù)組,z為乘法的積。為了保持和第1步中函數(shù)的參數(shù)變量保持一致,我們起了同樣的x 和y的名字。z用來(lái)顯示運(yùn)算結(jié)果。然后在第4個(gè)button中我們調(diào)用了一個(gè)定義的函數(shù)do_multiply(),注意函數(shù)名與我們?cè)诘冢辈街械腜HP 函數(shù)名有些類(lèi)似,區(qū)別是在其名稱(chēng)前面加了一個(gè)“do_”前綴。
3、Javascript的函數(shù)
為了讓第二步中Input輸入的結(jié)果提交給第一步中的那個(gè)PHP函數(shù),我們要寫(xiě)如下的Javascript代碼,也就是第二步中出現(xiàn)的函數(shù)do_multiply()。
代碼:
function do_multiply() {var x, y;
x = document.getElementById(\"x\").value;//獲取X的值
y = document.getElementById(\"y\").value;//獲取Y的值
x_multiply(x, y, do_multiply_cb);
}
在此函數(shù)中,我們可以看到函數(shù)在獲取到Input輸入的結(jié)果后執(zhí)行了一個(gè)x_multiply()函數(shù)。此函數(shù)的參數(shù)應(yīng)該和第一步中我們定義的PHP函數(shù)的參數(shù)保持一致,最后附加的do_multiply_cb為Ajax在調(diào)用了PHP的函數(shù)后要執(zhí)行的Javascript函數(shù),我們定義此函數(shù)名為 do_multiply_cb,并對(duì)此函數(shù)作如下的定義。
代碼:
function do_multiply_cb(z) {document.getElementById(\"z\").value = z;
}
此函數(shù)有一個(gè)參數(shù),返回值直接放入Z中,用以顯示返回的結(jié)果。
至此,Ajax設(shè)計(jì)網(wǎng)頁(yè)的三個(gè)關(guān)鍵步驟制作完畢,然后,我們用搭積木的方式把他們拼接在一起,就大功告成了!
<?
require(\"Sajax.php\");
[步驟1的PHP函數(shù)]
sajax_init();
sajax_export(\"multiply\");//聲明需要用Ajax關(guān)聯(lián)的函數(shù)
sajax_handle_client_request();
>
<script>
<?
sajax_show_javascript();
>
[步驟3的Javascript函數(shù)]
</script>
<body>
[步驟2的HTML代碼]
</body>
上面這個(gè)例子是網(wǎng)上講的比較多的一個(gè)sajax.php的例子,大家不妨試試這部分代碼,可初步對(duì)ajax技術(shù)帶來(lái)的技術(shù)好處有個(gè)理解。然而在實(shí)際進(jìn)行大的開(kāi)發(fā)中需要解決一些問(wèn)題。
如上列,字符串傳回到multiply()函數(shù)時(shí),有中文的話,則是UCS-2格式,如果要想在do_multiply_cb()正確顯示從multiply()中得到的中文字符串,則必須先把他轉(zhuǎn)換成UTF-8格式。本老人曾在網(wǎng)上找了好多方法都沒(méi)有能正確實(shí)現(xiàn),最后自己用如下方法實(shí)現(xiàn),如果有可以改進(jìn)的地方請(qǐng)指教。
function unescape($str) {
$str=rawurldecode($str);
$ar = explode("%u",$str);
foreach($ar as $k=>$v) {
if($k!=0){
if(strlen($v)==4)
$ar[$k] = iconv("UCS-2","UTF-8",pack("H4",substr($v,0,4)));
elseif(strlen($v)>4)
$ar[$k] = iconv("UCS-2","UTF-8",pack("H4",substr($v,0,4))).substr($v,4,strlen($v)-4);
}else{
if($v!="")
$ar[$k] = $v;
}
}
return join("",$ar);
}
另外若想在multiply()函數(shù)中傳遞過(guò)來(lái)的字符串以簡(jiǎn)體中文格式插入到數(shù)據(jù)庫(kù)中,則還需把原來(lái)轉(zhuǎn)換得到的UTF-8格式的字符串再轉(zhuǎn)換為GB2312,代碼如下
function utfgb2($string) {
$out = iconv( "UTF-8" ,"GB2312", $string);
return $out;
}
當(dāng)然如果不需要在do_multiply_cb()正確顯示從multiply()中得到的中文字符串,可以在unescape($str)函數(shù)中直接把"UCS-2"轉(zhuǎn)換成"GB2312"格式,否則需要轉(zhuǎn)換兩次。