四、常見Ajax編程架構
既然上述Ajax架構已經能工作了，為什麼還有那麼多的架構呢？
隨著頁面的複雜，可能需要書寫大量的Javascript指令碼來對頁面中的DOM對象進行控制，工作量和複雜度會大大增加。Ajax編程架構通常利用物件導向的方法，對一些基本的對象和行為及其複雜性進行了合理的封裝，建造了一套有自己特色的類庫，並且考慮了效率和可擴充性等優點。我們在開發時，可以使用較少的、更清晰的代碼，完成自己的工作。也使程式員有更多的時間和精力考慮商務邏輯本身，而不是與一堆指令碼糾纏在一起。
架構都是與後台指令碼相關的。通過後台指令碼編程，我們可以不必書寫大量的Javascript指令碼就能構建瀏覽器安全色的Ajax應用。
比如，我使用一個比較流行的PHP xAjax架構，對前邊的樣本程式進行了改寫：
<?php
require_once ("../xajax/xajax.inc.php");
//伺服器處理函數
function processForm($aFormValues)
{
$objResponse = new xajaxResponse();
$bError = false;
//清空錯誤資訊
$objResponse->addClear("usernameInfo", "innerHTML");
//判斷帳號
if (trim($aFormValues['username']) == "")
{
$objResponse->addAppend("usernameInfo", "innerHTML", "Please Input user name.");
$bError = true;
}
else
{
if(trim($aFormValues['username'])=="Thomas")
$objResponse->addAppend("usernameInfo", "innerHTML", "Has been registed");
else
$objResponse->addAppend("usernameInfo", "innerHTML", "Has not been registed");
$bError = false;
}
if (!$bError)
{
$sForm .="<div>帳號：" .$aFormValues['username']. "</div>/n";
}
else
{
$objResponse->addAssign("submitButton", "value", "Submit");
$objResponse->addAssign("submitButton", "disabled", false);
}
return $objResponse;
}
//構造對象
$xajax = new xajax();
//註冊處理函數
$xajax->registerFunction("processForm");
//接管HTTP請求
$xajax->processRequests();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<?php
//產生必要的JavaScript
$xajax->printJavascript('../xajax/');
?>
<title>XAJAX 使用者註冊</title>
<style type="text/css">
#formWrapper{ color: #111111; background-color: rgb(200,200,200); width: 360px;}
#title{color: #FFFFFF; text-align: center; background-color: #000000; }
#formDiv{ padding: 20px;}
.submitDiv{ margin-top: 10px; text-align: center; }
.errorSpan{ color:red;}
</style>
<script type="text/javascript">
<!--//提交表單
function submitSignup()
{
xajax.$('submitButton').disabled=true;
xajax.$('submitButton').value="驗證中...";
xajax_processForm(xajax.getFormValues("signupForm"));
return false;
}
//-->
</script>
</head>
<body>
<form id="signupForm" action="javascript:void(null);" onsubmit="submitSignup();">
使用者名稱：<input type="text" name="username" value="">
<input type="button" name="check" value="Check Only one" onClick="submitSignup();">
<input type="submit" id="submitButton" name="submit" value="Submit">
</form>
<div id="usernameInfo" class="errorSpan"> </div>
</body>
</html>
大家看到了這段代碼前邊的包含語句了吧：require_once ("../xajax/xajax.inc.php")。xajax.inc.php就是定義xajax等相關類庫的檔案，這個檔案裡還包含了大量的javascript指令檔和其他的常數定義等。Xajax類有一條自己的屬性和方法，接管和封裝了原始的Ajax的行為和方法，用於處理使用者的事件和頁面文檔對象的屬性和外觀。
Ajax架構有它自己的好處，但是，目前由於Ajax架構太多，各有各的優點和缺點，特別是對PHP語言，我們很難在眾多的架構中選中一個最適合我們自己的項目的架構。架構太多加大了交流的成本。架構本身在降低了代碼複雜度的同時，也帶來了學習的成本。不像.NET，背靠財大氣粗的公司，就一套程式庫，一套通用的IDE，熟練一門語言(比如C#)，就可以開發Web和案頭應用。
最後還要注意一下，Ajax並不是萬金油，任何項目都想用一下。Ajax目前大多數應用在資料校正等應用上，在項目中用的時候請謹慎考慮。
張慶（網眼）http://blog.why100000.com
電腦學習網：http://www.why100000.com
2010-1-22
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
