带CheckBox,RadioButton的网页树控件

EXTree(Extended XTree)基于XTree开发而成。我于2004年完成第一个版本,至今已
历时3年多,期间多次升级和完善,扩展出了很多的功能。最新版本是2.5,于08年3月推出。
这些年中在N个项目上使用验证表明,EXTree简单易用,功能强大,可以满足项目上需要的所有
复杂的功能要求。
EXTree使用Javascript和Ajax技术,面向对象设计思想,遵循DOM1标准,可以在支持DOM1的浏览器运行。
在我所做的测试中,EXTree能用在IE5.5+,Opera9,FireFox2上。其中在IE上得到多个项目使用。由于FireFox
上Ajax的同步处理时不响应onreadystatechange事件,所以在FireFox上只能用异步处理Ajax请求。
EXTree有普通树、CheckBox树、RadioButton树 3种类型的树,每种类型的树又分为静态和动态两种,所以
共有6种类型的树(静态树是指树节点在网页生成时,已经全部加载。动态树是指网页生成时只生成了部分
节点,当展开某节点时,才取它的子节点加载)。因为EXTree是面向对象的设计,不同类型的树节点类是
具有继承关系,所以同一棵树可以有不同类型的树节点, 这里看截图 http://hi.baidu.com/apollo47/album
EXTree除了一般我们见到的网页树控件有的功能外,还具有以下特色功能:
1、面向对象设计,易学易用;
2、独立的CSS控制外观;
3、可以在cookie保存树的展开状态;
4、树节点可以有不同的图标;
5、不用刷新页面而改变节点的名称和图标;
6、树节点名称文本可以设置不同的颜色;
7、树节点可以自定义属性。当你需要通过节点获取到更多的信息时,就可用自定义属性。比如组织机构树
有机构、用户节点,机构可能还分多种类型,这时就可以用节点自定义属性来区分树节点是哪种类型;
8、CheckBox树、Radio树节点可以禁用(disabled),禁用后树节点变灰,并不可用;
9、CheckBox树中,可以由开关控制是否级联选择(选中父节点时是否自动选中它的所有子节点);
10、CheckBox树节点有notReturn属性,当该属性为true时,即使这个节点被选中,调用方法获取所有选中
的节点时,这个节点的值不会返回。比如当某个业务要选择用户,这时提供一棵机构和用户的CheckBox树,
机构节点的notReturn属性设为true。这样即使机构节点处于选中状态,也不会被返回;
11、CheckBox树、Radio树提供onchange事件。当单击树节点的CheckBox或RadioButton时,触发onchange事件;
12、动态树提供onloaded事件。当某动态节点展开并加载完它的子节点时,触发该事件;
生成树的简单示例代码:
// importextree.jsfile.
< scriptlanguage = " javascript " >
webFXTreeConfig.setImagePath(
" js/images/ " ); // 设置节点图标所在路径.
var tree = new WebFXTree( " 树根节点 " , " alert('TreeRoot') " ); // 生成树根节点.
var node1 = new WebFXTreeItem( " 树节点1 " , " alert('TreeNode1') " ,tree); // 树根的第一个子节点。
var node2 = new WebFXTreeItem( " 树节点2_sina首页 " , " http://www.sina.com.cn " ); // 生成第二个节点。
tree.add(node2); // node2加为tree的子节点。
document.write(tree); // 在页面显示树.
</ script >
上面这段代码简单演示了EXTree构造树的过程,非常简单,易懂,没有复杂的HTML代码拼接。
我的百度空间中有EXTree效果截图 http://hi.baidu.com/apollo47/album
我的联系方式:QQ: 22309797 EMail: [email protected]
声明:本文可以转载,但必须注明原作者和出处。

你可能感兴趣的:(JavaScript,Ajax,IE,百度,firefox)