属性
|
||
属性名
|
属性类型(js数据类型)
|
描述
|
id
|
Number
|
只读属性,节点的唯一ID
|
text
|
String
|
节点显示的标签名
|
action
|
String
|
该节点对应的url连接
|
open
|
Boolean
|
节点是否展开(如果没有子节点会一直返回false)
|
icon
|
String
|
节点图标.默认为xtree.js同级目录下images目录下的图象
|
openIcon
|
String
|
节点折叠时的图标,默认为xtree.js同级目录下images目录下的图象
|
parentNode
|
Reference
|
父节点的引用
|
childNodes
|
Array
|
子节点数组
|
方法
|
||
方法名
|
方法返回类型
|
描述
|
add(oNode, [bNoIdent])
|
Reference
|
添加一个树节点(子树)到当前节点,包含两个参数,前一个为
webfxtreeitem
对象实例,后一个为可选
boolean
参数,设为
true
将防止在增加树节点时树的折叠操作,返回被加入节点的引用
|
indent()
|
Void
|
折叠操作
|
toggle()
|
Void
|
折叠/展示切换
|
expand()
|
Void
|
展开
|
collapse()
|
Void
|
折叠
|
expandAll()
|
Void
|
展开该节点及所有下级子节点.
|
collapseAll()
|
Void
|
折叠该节点及所有子节点
|
expandChildren()
|
Void
|
折叠该节点的所有子节点
|
toString()
|
String
|
构造树节点的Html代码
|
构造方法:new WebFXTree([text], [action])
|
||
参数名
|
参数类型(js数据类型)
|
描述
|
text
|
String
|
根节点显示标签
|
action
|
String
|
根节点的url(可选参数)
|
属性
|
||
属性名
|
属性类型(js数据类型)
|
描述
|
rendered
|
Boolean
|
表明树是否已创建并渲染
|
方法
|
||
方法名
|
方法返回类型
|
描述
|
getSelected()
|
Reference
|
返回用户选择的节点实例.
|
setBehavior(sBehavior)
|
Void
|
默认为classic,如果设置为explore时可以使树节点展示看起来更像windows Explore
|
getBehavior()
|
String
|
返回classic/explore
|
构造方法:WebFXTreeItem([text], [action], [parent], [icon], [openIcon])
|
||
参数名
|
参数类型(js数据类型)
|
描述
|
text
|
String
|
根节点显示标签
|
action
|
String
|
根节点的url(可选参数)
|
parent
|
Reference
|
父节点(可选参数)
|
icon
|
String
|
节点图标(可选参数)
|
openIcon
|
String
|
节点展开时的图标(可选参数)
|
方法
|
||
方法名
|
方法返回类型
|
描述
|
getFirst()
|
Reference
|
返回一个子节点的引用
|
getLast()
|
Reference
|
返回最后一个子节点的引用
|
var tree = new WebFXTree('Root');
tree.setBehavior('explorer');
tree.icon = ' /images/notepad.gif';
tree.add(new WebFXTreeItem('1'));
var folder = new WebFXTreeItem('2')
tree.add(folder);
var t21 = new WebFXTreeItem('2.1');
t21.action = “/jsp/treeAction.do?id=2.1”;
folder.add(t21);
var t22 = new WebFXTreeItem('2.2');
t21.action = “/jsp/treeAction.do?id=2.2”;
folder.add(t22);
var t23 = new WebFXTreeItem('2.3');
t21.action = “/jsp/treeAction.do?id=2.3”;
folder.add(t23);
tree.add(new WebFXTreeItem('3'));
t21.action = “/jsp/treeAction.do?id=3”;
document.write(tree);
实例 代码:<script type="text/javascript"> // var tree_gen="<?php echo $arr[0]['ConstrProjName'];?>"; // var tree_len="<?php echo count($arr);?>" // var arr = <?php echo json_encode($arr) ?>; if (document.getElementById) { var tree = new WebFXTree('工程建名'); tree.setBehavior('classic'); <?php if($arr){ foreach ($arr as $value){ echo "var note".$value['ConstrProjID']." = new WebFXTreeItem('".$value['ConstrProjName']."');\r\n"; echo "note".$value['ConstrProjID'].".action=\"".$value['PLeft']."\";"; if ($value['KindLvl']=="1"){ //echo "action"; //echo "note".$value['ConstrProjID']".".action=\"aaa\";"; echo "tree.add(note".$value['ConstrProjID'].");\r\n"; }else{ //echo "note".$value['ParentID']".".action=."aaa"; echo "note".$value['ParentID'].".add(note".$value['ConstrProjID'].");\r\n"; } } } ?> document.write(tree); tree.expandAll(); } //document.write("999"); </script>
360右键 查看源码效果if (document.getElementById) { var tree = new WebFXTree('工程建名'); tree.setBehavior('classic'); var note2 = new WebFXTreeItem('横岭特大桥'); note2.action="http://www.tiejian.com:81/project_c/projectDesign_select/2";tree.add(note2); var note4 = new WebFXTreeItem('津台'); note4.action="http://www.tiejian.com:81/project_c/projectDesign_select/4";note2.add(note4); var note6 = new WebFXTreeItem('大桥刺填筑'); note6.action="http://www.tiejian.com:81/project_c/projectDesign_select/6";note4.add(note6); var note7 = new WebFXTreeItem('摩擦板'); note7.action="http://www.tiejian.com:81/project_c/projectDesign_select/7";note4.add(note7); var note10 = new WebFXTreeItem('梁面'); note10.action="http://www.tiejian.com:81/project_c/projectDesign_select/10";note2.add(note10); var note11 = new WebFXTreeItem('吊杆孔'); note11.action="http://www.tiejian.com:81/project_c/projectDesign_select/11";note10.add(note11); var note12 = new WebFXTreeItem('打磨修补'); note12.action="http://www.tiejian.com:81/project_c/projectDesign_select/12";note10.add(note12); var note15 = new WebFXTreeItem('桥面供水'); note15.action="http://www.tiejian.com:81/project_c/projectDesign_select/15";note2.add(note15); var note16 = new WebFXTreeItem('桥台防护墙'); note16.action="http://www.tiejian.com:81/project_c/projectDesign_select/16";note2.add(note16); var note3 = new WebFXTreeItem('东新店子隧道'); note3.action="http://www.tiejian.com:81/project_c/projectDesign_select/3";tree.add(note3); var note13 = new WebFXTreeItem('子项目一'); note13.action="http://www.tiejian.com:81/project_c/projectDesign_select/13";note3.add(note13); var note14 = new WebFXTreeItem('子项目二'); note14.action="http://www.tiejian.com:81/project_c/projectDesign_select/14";note3.add(note14); document.write(tree); tree.expandAll(); }