Xajax 0.5:Zh: Tutorials: Learn xajax in 10 Minutes
Xajax 0.5:Zh: Tutorials: Learn xajax in 10 Minutes
[edit] 在PHP程序中使用xajax
xajax被设计为无论在现存的还是新的项目中都十分容易使用。通过下面7个简单步骤，你就可以将xajax整合到你的项目中:
- 包含xajax的函数库文件:
require_once("xajax_core/xajax.inc.php");
- 创建一个xajax对象:
$xajax = new xajax();
- 注册你想要通过xajax调用的函数:
$xajax->registerFunction("myFunction");
- 实现这些函数，并在这些函数中通过xajaxResponse对象返回XML命令:
function myFunction($arg) { /* 根据参数$arg执行适当的处理工作（比如查询数据库），并把结果保存在一个变量 * 比如$newContent中 */ $newContent = "Value of \$arg: ".$arg; /* 创建一个xajaxResponse对象 */ $objResponse = new xajaxResponse(); /* 在返回中加入一个命令来设置id为"SomeElementId"的元素的innerHTML属性为 * $newContent */ $objResponse->addAssign("SomeElementId","innerHTML", $newContent); //返回由objResponse对象创建的XML格式的返回内容 */ return $objResponse; }
- 在你的程序发送输出之前，由xajax处理所有请求：:
$xajax->processRequests();
- 在你的HTML的<head></head> 标签之间加入下面一句以产生xajax初始化所需的代码:
<?php $xajax->printJavascript(); ?>
- 在你的客户端代码中，通过事件或者在javascript函数中调用来使用xajax:
<div id="SomeElementId"></div> <button onclick="xajax_myFunction(SomeArgument);">
整个过程就是这样. xajax---------------------------------------------------------------------------------------------- 它几乎为你完成所有其他事情. 现在你最大的任务就是完成一系列的PHP函数并在这些函数中返回xajax的XML格式响应，而这通过使用xajaxResponse 类已经变得十分简单.
[edit] 我怎样实现异步更新我的内容?
或许xajax唯一的特色就是 xajaxResponse 类了. 其他Ajax库需要你自己实现javascript回调函数来处理从异步请求中返回的数据并更新网页内容。xajax则不一样, 它允许你更容易的在PHP中控制你的内容. xajaxResponse 类允许你从PHP函数中创建XML指令并返回到你的应用程序中. XML内容被xajax message pump解析，然后这些指令将会告诉xajax如何来更新你的应用程序中的内容以及它的状态. xajaxResponse 类目前可以提供不少有用的命令，比如Assign, 用来设置元素的属性; Append, 用来附加数据到页面中某元素的指定属性; Prepend, 用来添加数据到页面中某元素指定属性的值的开始位置; Replace, 用来查找替换属性值; Script, 用来运行直接返回的javascript代码; 还有Alert, 用来显示含有指定内容的警告框.
一个XML response 可以包含多个命令, 这些命令将会被按照它们被添加到response的先后顺序被执行. 例如, 比方一个用户点击了你的应用程序中的一个按钮. 点击按钮的"onclick"事件将会触发一个PHP函数的javascript包装函数. 这个包装函数将会通过XMLHttpRequest发送一个异步请求给服务器，然后在服务器上xajax将会调用对应的PHP函数. 这个PHP函数将会执行数据库查询、数据处理或序列化（数据保存）等功能. 最后，你使用xajaxResponse 类来产生一个包含多个命令的xajax XML 响应并送回到xajax message pump，这些命令将在客户端代码（HTML/javascript)中被执行:
$objResponse = new xajaxResponse(); $objResponse->assign("myInput1","value",$DataFromDatabase); $objResponse->assign("myInput1","style.color","red"); $objResponse->append("myDiv1","innerHTML",$DataFromDatabase2); $objResponse->prepend("myDiv2","innerHTML",$DataFromDatabase3); $objResponse->replace("myDiv3","innerHTML","xajax","<strong>xajax</strong>"); $objResponse->script("var x = prompt(\"输入你的姓名\");"); return $objResponse;
对于以上代码所产生的XML响应， xajax message pump 将解析并最终执行以下动作:
- ID为myInput1的元素的值将被设为$DataFromDatabase。
- ID为myInput1的元素的文本颜色将被设为红色。
- 变量$DataFromDatabase2中的内容将被附到ID为myDiv1的元素的innerHTML最后。
- 变量$DataFromDatabase3中的内容将被添加到ID为myDiv2的元素的innerHTML前面。
- ID为myDiv3的innerHTML中出现的所有"xajax"字符串将被替换为"xajax"; 也就是说将所有的"xajax"设为粗体。
- 将会出现一个对话框提示输入你的姓名，并且用户输入的内容会被放在名为x的javascript变量中。
以上所有这些功能都是在服务器端PHP函数中通过构造并返回一个XML响应来实现的。
