xajax
http://wiki.xajaxproject.org/0.5_Documentation
封装的很好的php类,可以很方便实现ajax的功能。
优点,简单,对js要求不是很高,会写php的函数就能用。
原文:http://xajax.sourceforge.net/
英文原版:Copyright © 2005 J. Max Wilson
简体中文翻译:HonestQiao(乔楚)/2005-12-7 17:23/(第一版)
什么是xajax?
xajax如何工作?
为什么我要使用xajax代替其他PHP的Ajax库?
如何在我的PHP脚本之中使用xajax?
如何异步更新内容?
如何异步处理表单数据?
如何给xajax增加定制功能?
我能在私有或者收费产品之中使用xajax吗?
什么是xajax?
Xajax是一个开源的 PHP 类库 它能够让你黏合HTML、CSS、JavaScript和PHP,轻而易举的开发功能强大、基于WEB的AJAX应用软件. 使用xajax开发的应用软件,无需重新调入页面,就能够异步调用服务器端的PHP函数和更新内容.
xajax 如何工作?
你的应用软件需要异步调用的PHP函数, xajax的PHP对象都生成了对应的封装好了的JavaScript函数. 当被调用时,封装的函数使用JavaScript的XMLHttpRequest对象与服务器异步通讯,调用xajax对象对应的PHP函数. 调用结束后, PHP函数由xajax返回一个xajax的XML响应传递给应用程序. XML响应包含了特定的指令和数据,他们可以被xajax的JavaScript消息分析器解析,并且被用于更新你的应用程序的内容.
为什么我要使用xajax代替其他PHP的ajax库?
你应该选择一个最适合你的项目需要的库.
xajax 提供了以下的功能, 它们使得ajax富有特色而又功能强大:
Xajax特殊的 XML 响应 / javascript 消息分析系统 帮助你做到, 自动的处理函数返回的数据,按照PHP函数返回的指令更新内容或者状态. 因为xajax作了这些工作Because xajax does the work, 你不需要写javascript的回调处理函数.
Xajax反对将代码和数据紧密地杂糅在一起的主张, 并且保持xajax的代码从与他代码分离. 因为它是对象构造的, 你可以加上自己定制的功能给xajax去扩展xajaxResponse 类和使用addScript方法.
xajax 可以工作在 Firefox, Mozilla, 大部分基于 Mozilla 的浏览器, Internet Explorer, 和 Safari.
除了更新元素的值和内含的HTML内容(innerHTML), xajax 还能用于更新样式(styles), css 类, 多选和单选按钮选择,甚至可以更新任何元素的属性.
xajax 支持使用一维或者多维数组、关联数组(哈希数组) 作为xajax函数的参数从javascript传送给PHP. 反之Additionally, 如果你传送一个javascript的对象给xajax函数,PHP函数将接受一个描叙对象属性的关联数组(哈希数组).
xajax 提供了一种简单的异步表单处理方式. 使用 xajax.getFormValues() javascript 方法, 你可以轻而易举的在表单之中提交一个描绘值的数组作为参数传送到xajax异步处理函数:
xajax_processForm(xajax.getFormValues('formId');
它可以处理复杂的input 元素名称 ,例如 "checkbox[][]" 或者 "name[first]" 产生的多维或者关联数组(哈希数组), 就是普通提交表单那样使用PHP的$_GET数组
使用xajax你可以动态的发送附加的javascript作为请求的响应到你的应用软件中运行,而这就和动态的更新元素的属性一样方便.
Xajax会自动比较PHP函数返回的数据与你已经标记需要修改的元素属性. 只有当新的数据确实可以改变现有的属性,属性才会真的被更新. 这将可消除程序在一定时间间隔内更新与当前内容相同或者不同的内容而出现的明显的闪烁.
每一个通过xajax简单注册的函数都可以有不同的请求方式. 所有的函数默认使用POST方式,除非你明确的指定使用GET方式. 如果使用GET请求,你必须非常明确的考虑它确实是你所需要的
如果没有指定URI,xajax将设法自动确定脚本的URI. Xajax的自动确定算法经过了充分的验证,确保在大部分HTTPS或者未知端口的HTTP服务器上也可以正常的工作.
Xajax使用UTF8编码所有的请求和响应,以确保支持绝大部分的字符和语言. Xajax已经成功测试了多种不同的UNICODE字符,包括Spanish, Russian, Arabic, and Hebrew
几乎所有xajax生成的javascript都可以通过动态的外部javascript包含到你的web程序之中. 当你在浏览器之中查看程序的源代码时,不会有JavaScript的函数定义混杂在HTML标记之中.
Xajax可以使用在Smarty模板系统之中,仅仅需要创建一个smarty变量就可以包含xajax的javascript:
$smarty->assign('xajax_javascript', $xajax->getJavascript());
然后你可以使用在header模版之中使用
{$xajax_javascript}
从而把xajax应用到你的站点.
如何在我的PHP脚本之中使用xajax?
Xajax的设计是如此的富有特色,以至于不管是已有的web程序还是新的项目,它都能够被极其简单的部署和应用. 仅仅需要七步,你就可以在几乎任何PHP脚本之中加入xajax的强大功能:
包含xajax类库:
require_once("xajax.inc.php");
实例化xajax 对象:
$xajax = new xajax();
注册你需要通过xajax调用的PHP函数的名称:
$xajax->registerFunction("myFunction");
编写注册的PHP函数,并且在函数之中使用xajaxResponse 对象返回XML指令:
function myFunction($arg)
{
// 对$arg做一些基本处理例如从数据库检索数据
// 然后把结果赋值给变量,例如$newContent
// 实例化xajaxResponse 对象
$objResponse = new xajaxResponse();
// 添加指令到响应之中,用于指派
//指定元素(例如id="SomeElementId")的innerHTML属性的新的内容
$objResponse->addAssign("SomeElementId","innerHTML", $newContent);
//返回xajaxResponse 对象生成的XML响应
return $objResponse->getXML();
}
在你的脚本输出任何信息之前,调用xajax用于接管请求:
$xajax->processRequests();
在页面的 <head></head> 标签之间, 告诉xajax生成所必需的JavaScript:
<?php $xajax->printJavascript(); ?>
在程序中,从JavaScript事件或者函数调用前面注册的函数:
当然,如果你用的是smarty模板的话,则你需要在PHP中用下面的方法
$smarty->assign('xajax_js',$xajax->getJavascript());
然后在模板中用{$xajax_js}调用
<button onclick="xajax_myFunction(SomeArgument);">
就这么简单. xajax 会处理其他所有的事情. 你所要做的主要工作就是编写PHP函数,然后从函数之中返回xajax的XML响应。而后者通过xajaxResponse类可以非常简单的生成.
目前最新版为 0.5 Beta4版
补充:
一、ajax+smarty范例和xajax的一些问题
网上关于XAJAX的教程很少,出现最多的就是那个七步使用XAJAX的文档。不过那个东西没有提到一下东西,我就简单说一下。都是自己摸索的,有不对的地方还请指教。
一切说明都以0.25版本为基础,0.5BETA的用户请顺藤摸瓜照葫芦画瓢照猫画虎举一反三……
第一个问题,我怎么才能实现逻辑和表现分离啊?(HTML代码和程序代码分离)
要做到这个我们必然需要一个模板引擎了(当然也可以写一个超级简单的,不过再简单也叫模板引擎吧……)
目前比较火的是SMARTY吧?咱们就用SMARTY+XAJAX开说。
比如我们现在要制作一个用户信息页面,简单的左右两边的页面。左边是导航,右边是具体的内容。
HTML我简单写一个:
<div id="main"> <div id="left"> <li><a href="#" mce_href="#" onClick="xajax_showDetail();"></li> <li><a href="#" mce_href="#" onClick="xajax_showUserinfo();"></li> </div> <div id="right"> </div> </div>
分别表示左右两个部分。左边有两个链接,点击后右边通过AJAX取得数据并且重新填充。
现在我们构建两个模板页面,对应上面链接。
detai.htm:
<div> {|$detail|}<!--这个$detail是smarty要替换的内容--> </div>
userinfo.htm:
<div> {|$userinfo|}<!--这个$userinfo是smarty要替换的内容--> </div>
好了准备工作结束
开始xajax server的编写
server.php:
<?php $xajax = new xajax(); $smarty = new smarty(); function Detail() { $objResponse = new xajaxResponse(); $detail = "测试XAJAX"; /*********这里是重点部分***************/ $smarty -> assign('detail',$detail);//替换模板的数据 $content = $smarty -> fetch('detail.htm');//这里是最重要的一步,smarty把动态数据替换模板,并且返回已经替换过后的模板HTML数据 /****接着我们用替换过的数据通过AJAX填充页面*****/ $objResponse -> addAssign('right','innerHTML',$content); retuen $objResponse ; } $xajax -> registerFunction('detail');//注册函数 $xajax -> processRequests();//接管请求 ?>
server.php编写结束,当然无视了userinfo这个东西,因为东西是一样的。
到此为止,我们实现了XAJAX和SMARTY结合实现AJAX效果的目的。
接着再说说如何实现更炫的效果
见过很多使用AJAX技术的网站在读取数据的时候都会出现一个进度条写着读取中吧?感觉很COOL是吧,XAJAX照样也能做!
其实很简单,在要出现进度条的页面上首先放上如下代码:
<!--loding--> <div id="loadingContainer"><div id="loading">页面载入中,请稍候<br/><img src="src/images/common/loader.gif" mce_src="src/images/common/loader.gif" /></div></div> <!--loding end-->
这样就做出了来了一个显示等待条的方块。
接着在页面里面写上如下JS代码:
<script languege="javascript/text"> loadingpic = document.getElementById('loadingContainer'); loadingpic.style.display = 'none';// 初始化进度条为不可见 /*****这两句话比较重要*****/ xajax.loadingFunction = loading; // 定义XAJAX在等待请求时候调用的函数 xajax.doneLoadingFunction = loadingDone; //定义XAJAX在或得请求数据以后调用的函数 function loading() { loadingpic.style.display = 'block'; //设置请求数据的时候可见 } function loadingDone() { loadingpic.style.display = 'none'; //设置请求结束以后消失 } </script>
就这么简单的几句,状态条功能就实现了。
注意,如果从请求到获得数据的时间小于400毫秒的话,XAJAX默认不调用定义的函数,这主要是为了保证良好的效果。毕竟条一闪即逝没什么意思,还不如不显示。如果非得想要让用户看见,可以在PHP里面SLEEP(1) 一下,嘿嘿。
最后一个问题,使用了XAJAX以后鼠标箭头频繁闪动怎么办?
这个问题一般出现需要频繁和后台沟通的情况下。比如我们定义每0.5秒请求一次服务器。这时候你会发现一个问题,就是鼠标箭头每隔0.5秒都会变成等待中(带个沙漏)的样子一下,闪的人心烦,并且让人产生页面一直都在刷新的可耻想法。
要解决这个问题非常的简单其实……
只要在实体化XAJAX以后加上一句话就可以了:
$xajax->waitCursorOff();
这样就可以避免鼠标闪动了。
我试了试这个方法,好像不管用,在xajax.inc.php里也没这个方法,不过有CursorOff这个变量,把他改为FALSE就行了
二、Xajax 0.5 使用多个不同请求
怎么把客户端和要请求的php方法分离到两个页面呢,请看下去
1)新建一个全局的xajax包含文件
<?php// Requiring the xajax core file
require_once "xajax/xajax_core/xajax.inc.php";// Defining the xajax object
$xajax = new xajax();
?>
2)新建一个带标准xajax调用的通用php文件
<?php// Common file// Registering our function, remember that the URI must be a string: "handler.php"
$xajax->register(XAJAX_FUNCTION, 'myFunctionA', array('URI' => ""handler.php""));
?>
3)新建一个处理文件
<?php// Handler// Require the ajax global file
require_once "xajax_include.php";
// Require the common file for this handler
require_once "common.php";
// Our function
function myFunctionA($givenParameters) {
// new xajaxResponse Object
$objResponse = new xajaxResponse();
// Process
return $objResponse;
}
// Let xajax process our request
$xajax->processRequest();
?>
4)新建一个主文件
<?php// Require the xajax global file
require_once "xajax_include.php";// Require the Common file for this page
require_once "common.php";
?>
<!DOCTYPE ... />
<html>
<head>
<?php $xajax->printJavascript(); ?>
...
</head>
etc ...
5)调用函数代码:
<a href='#' onclick='xajax_myFunctionA(); return false;'>
6)依上述步骤来写多种文件,分别包含各自的通用文件和处理文件。但是要注意包含所有通用文件,这样才能注册和使用所有处理函数。