轉(zhuǎn)自:http://webfx.eae.net/dhtml/xtree/xtree.html
文件: xtree.js
Usage(用法):
var tree = new WebFXTree('Root');
tree.add(new WebFXTreeItem('Tree Item 1'));
tree.add(new WebFXTreeItem('Tree Item 2'));
tree.add(new WebFXTreeItem('Tree Item 3'));
document.write(tree);
Folders(可折疊的):
var tree = new WebFXTree('Root');
/* Add tree item to tree */
tree.add(new WebFXTreeItem('1'));
/* Create a new folder and add it to tree */
var folder = new WebFXTreeItem('2')
tree.add(folder);
/* Add tree items to folder */
folder.add(new WebFXTreeItem('2.1'));
folder.add(new WebFXTreeItem('2.2'));
folder.add(new WebFXTreeItem('2.3'));
/* Add another tree item to tree */
tree.add(new WebFXTreeItem('3'));
document.write(tree);
Explorer behavior (管理瀏覽器)
var tree = new WebFXTree('Root');
/* Change the behavior of the tree */
tree.setBehavior('explorer');
/* Add tree item to tree */
tree.add(new WebFXTreeItem('1'));
/* Create a new folder and add it to tree */
var folder = new WebFXTreeItem('2')
tree.add(folder);
/* Add tree items to folder */
folder.add(new WebFXTreeItem('2.1'));
folder.add(new WebFXTreeItem('2.2'));
folder.add(new WebFXTreeItem('2.3'));
/* Add another tree item to tree */
tree.add(new WebFXTreeItem('3'));
document.write(tree);
Custom Icons(自定義圖標(biāo)):
var tree = new WebFXTree('Root');
tree.setBehavior('explorer');
tree.icon = 'http://webfx.eae.net/images/notepad.gif';
tree.add(new WebFXTreeItem('1'));
var folder = new WebFXTreeItem('2')
tree.add(folder);
var t21 = new WebFXTreeItem('2.1');
/* Change the icon */
t21.icon = webFXTreeConfig.fileIcon;
folder.add(t21);
var t22 = new WebFXTreeItem('2.2');
/* Change the icon */
t22.icon = webFXTreeConfig.fileIcon;
folder.add(t22);
var t23 = new WebFXTreeItem('2.3');
/* Change the icon */
t23.icon = webFXTreeConfig.fileIcon;
folder.add(t23);
tree.add(new WebFXTreeItem('3'));
document.write(tree);
xTree API
WebFXTreeAbstractNode
WebFXTree和WebFXTreeItem 的Abstract Object 、common function and methods 都是從這個(gè)
對(duì)象繼承來(lái)的。
Construtcto(構(gòu)造)
抽象對(duì)象,沒(méi)有實(shí)例應(yīng)該建立。
Properties( 屬性)
名字 類(lèi)型 描述
id(編號(hào)) Number 只讀屬性,可以用來(lái)找相關(guān) HTMLElement。
如果您知道id HTMLElement,你可以在webFXTreeHandler.all中尋找
JS Object
text(文字) String The text lable for the node.
action(uri) String The action (uri) associated with the node.
open (打開(kāi)) Boolean 只讀,布爾屬性,它告訴節(jié)點(diǎn)是張開(kāi)(expanded) 或者
關(guān)閉(collapsed).(如果沒(méi)有子節(jié)點(diǎn),將始終返回 false)
icon (圖標(biāo)) String Image File to use as icon,Uses default if not specified.
openIcon(打開(kāi)圖標(biāo)) String Image File to use as the open icon(if child nodes only).
Uses default if not (指定)specified.
parentNode Reference(參考) A reference(提及) to the parent node.
childNodes Array Connection(收集) of references(提及) to all child nodes;
Methods (方法)
name Returns description
add(oNode, reference 增加了樹(shù)項(xiàng)目目前的項(xiàng)目。 這種方法有兩種說(shuō)法,
[bNoIdent]) 一是WebFXTreeItem對(duì)象添加第二個(gè)是一個(gè)可選的布爾值,如果指定,并設(shè)置為true將防止樹(shù)從執(zhí)行Indent方
法自動(dòng)一旦節(jié)點(diǎn)已添加。此參數(shù)沒(méi)有影響調(diào)用Add方法之前,樹(shù)呈現(xiàn),但此標(biāo)志設(shè)置增加節(jié)點(diǎn)時(shí),
樹(shù)后,已變得將大大減少所需的時(shí)間來(lái)完成作業(yè),這可能是非常有益的,同時(shí)增加了一個(gè)節(jié)點(diǎn)的時(shí)間,
但要求Indent方法是手動(dòng)執(zhí)行頂部最節(jié)點(diǎn)受影響的變化之后。歸來(lái)的參考補(bǔ)充節(jié)點(diǎn)。
indent() void (xtree1存在,xtree2不存在) Redraws the traces between nodes and makes sure the tree is properly layed out.
toggle() void 切換展開(kāi)/拆疊
expand() void Expands the node
collapse() void Collapses the node
expandAll() void Expands the node and all its descendants
collapseAll() void Collapses the node and all its descendants
expandChildren() void Expands all the descendants of the node
collapseChildren() voie Collapse all the descendants of the node
getNextSibling() Reference Returns a reference to the next sibling.
(返回元素后緊跟的元素,如果無(wú)此節(jié)點(diǎn),則屬性返回null)
getPreviousSibling()Reference Returns a reference to the previous sibling.
(返回節(jié)點(diǎn)之前緊跟的同級(jí)節(jié)點(diǎn))
toString String (stree1存在,stree2 不存在)
WebFXTree
該WebFXTree對(duì)象是用來(lái)創(chuàng)建實(shí)際樹(shù)根,可后來(lái)被填入樹(shù)項(xiàng)目。所有屬性和方法從WebFXTreeAbstractNode繼承。
Constructor
new WebFXTree([text], [action], [behavior])
name type description
text String 任擇,文字標(biāo)簽樹(shù)根。
action String 任擇,The action (uri) associated with the tree root.
behavior String 任擇, 名稱(chēng)使用的方法,檢查 setBehavior() 方法的細(xì)節(jié)。
icon String 任擇, 圖像使用的圖標(biāo)。
openIcon String 任擇, 開(kāi)放圖標(biāo)的圖橡。
properties
name type description
rendered Boolean 檢舉,指出任何或沒(méi)有樹(shù)已產(chǎn)生和提供。
Methods
name Returns description
getSelected() Reference 如果有的話(huà),返回選擇對(duì)象的id
setBehavior(sBehavior) void 集行為的樹(shù)。描述的行為時(shí),使用開(kāi)放圖標(biāo)樹(shù)項(xiàng)目
getBehavior() String 返回behavtion (經(jīng)典或Explorer )是目前描述打開(kāi)的文件夾的描寫(xiě)。
WebFXTreeItem
用于創(chuàng)建樹(shù)的項(xiàng)目,可以增加(uising 的 Add方法)的 WebTXTree 或另一個(gè)WebFXTreeItem 對(duì)象。所有屬性和方法從WebFXTreeAbstractNode繼承.
Constructor
new WebFXTreeItem([text], [action], [parent], [icon], [openIcon])
name type description
text String 任擇,文字標(biāo)簽樹(shù)項(xiàng)目
action String 任擇,The action (uri) associated with the tree item.
parent Reference 任擇,父母樹(shù)項(xiàng)目。如果該項(xiàng)目提供然后將被作為一個(gè)孩子eParent
icon String 任擇。Image to use as the icon.
openIcon String 任擇. Image to use as the open icon.
method
name Returns description
getFirst() Reference 返回提到的第一個(gè)孩了節(jié)點(diǎn),如果有的話(huà)。
getLast() Reference 如果有的話(huà),返回提到的最后一個(gè)子節(jié)點(diǎn)。