作者:snow 日期:2006-01-25
XAJAX是一個比較優(yōu)秀的AJAX toolkit工具,安裝很簡單,就是吧他的xajax.inc.php文件copy到你制定的目錄下面就可以了。
下面舉兩個列子來說明如何使用
1)helloworld
helloworld是每一個編程語言所必須的,所以這里也不例外,我會就代碼給出解釋
<?php
// helloworld.php demonstrates a very basic xajax implementation
// using xajax version 0.1 beta4
// http://xajax.sourceforge.n...
require ('xajax.inc.php');? #必須的,放到腳本的最前面
#調(diào)用函數(shù),該函數(shù)被javascript調(diào)用
function helloWorld($isCaps)
{
if ($isCaps)
$text = "HELLO WORLD!";
else
$text = "Hello World!";
$objResponse = new xajaxResponse();
$objResponse->addAssign("div1","innerHTML",$text); #給id為div1的html元素的innerHTML屬性分配$text指,其他的方法請參考前面貼出的XAJAX介紹
return $objResponse->getXML();?? #返回賦值后的代碼,采用xml格式
}
// Instantiate the xajax object. No parameters defaults requestURI to this page, method to POST, and debug to off
$xajax = new xajax();
//$xajax->debugOn(); // Uncomment this line to turn debugging on
// Specify the PHP functions to wrap. The JavaScript wrappers will be named xajax_functionname
$xajax->registerFunction("helloWorld"); #注冊函數(shù),這個也是必須的,用來保證,javascript能調(diào)用php里面的函數(shù)
// Process any requests. Because our requestURI is the same as our html page,
// this must be called before any headers or HTML output have been sent
$xajax->processRequests();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm....
<html>
<head>
<title>xajax example</title>
<?php
#輸出javascript腳本,這個方法必須放在head之間,特別是應(yīng)該放在<html>標(biāo)簽之前,否則無法工組
$xajax->printJavascript();
?>
</head>
<body style="text-align:center;">
<div id="div1" name="div1"> </div>
<br/>
<button onclick="xajax_helloWorld(0)" >Click Me</button>
<button onclick="xajax_helloWorld(1)" >CLICK ME</button>
<script type="text/javascript">
xajax_helloWorld(0); // call the helloWorld function to populate the div on load
</script>
</body>
</html>上面的腳本是一個簡單的例子,但是體現(xiàn)了XAJAX使用的一個流程。需要注意的是在html腳本中,我們調(diào)用的函數(shù)名是
xajax_helloWorld
(),但是我們編程和注冊的函數(shù)名卻是helloWorld,這不是一個錯誤,而是必須這樣做,你可以查看xajax.inc.php的代碼就知道,他默
認的在html調(diào)用的函數(shù)名前綴就是xajax_helloWorld(),因此如果你不修改xajax.inc.php,那么你在html里面調(diào)用函數(shù)
就必須加上xajax_這樣的前綴。
程序演示2)表單處理
這個例子是我花時間比較多的,也是大家比較關(guān)心的,雖然官方也給出了一個form的例子,但是對表單數(shù)據(jù)的處理都是自己再重新寫的函數(shù),而沒有使用xajax.getFormValues函數(shù),個人覺得比較復(fù)雜。下面是官方的form演示和源代碼
form演示form源代碼下面是我的代碼
<?php
require("includes/xajax.inc.php");
function doSomething( $formData )
{
$objResponse = new xajaxResponse();
$str="";
foreach($formData as $key=>$value)
if (empty($str))
$str.=$key."='".$value."'";
else
$str.=",".$key."='".$value."'";
//$str="form data is ".implode(",",$formData);
//$objResponse->addAlert(print_r($formData));
$objResponse->addAssign("result", "innerHTML", $str );
return $objResponse->getXML();
}
function hb()
{
$objResponse = new xajaxResponse();
$objResponse->addAssign("doIt", "value", "Working...");
$objResponse->addAssign("doIt", "disabled", true);
$objResponse->addScript("xajax_doSomething(xajax.getFormValues('someForm'));");
return $objResponse->getXML();
}
?>
<?php
$xajax = new xajax();
//$xajax->debugOn();
$xajax->registerFunction("doSomething");
$xajax->registerFunction("hb");
$xajax->processRequests();
?>
<HTML>
<HEAD>
<?php $xajax->printJavascript(); ?>
</HEAD>
<BODY>
<form id='someForm'>
<table>
<tr>
<td>username:
<input type="text" name='user' id='user' />
</td>
<td>password:<input type="password" id='pwd' name='pwd' /></td>
<td><input type='button' id='doIt' value='Do It' onClick="xajax_hb()"></input>
</td></tr>
</table>
</form>
<div id='result'>
</div>
</BODY>
</HTML>
這個要注意的比較多
a)表單的元素必須有name屬性,這個一定要注意,這是我痛苦了一天得到的結(jié)果,否則getFormValues函數(shù)將得不到表單數(shù)據(jù)。
b) doSomething($formData)函數(shù)中的參數(shù)$formData是一個數(shù)組元素,索引是表單元素的名稱(屬性name的值),其值是表單元素的值(屬性value的值)
c) 如果debugon打開了,可能會出現(xiàn)死循環(huán)的警告窗口,目前還不知道原因。