tree 级联菜单__树型结构

chengyu2099

浏览: 477091 次
性别:
来自: 南京

最近访客更多访客>>

u012363178

zjjsgwm

dyf423

97wgl

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

Web-Jsp

HTML Ajax CSS JSP XHTML


不要着急 我们 来 先看看API

Overview
Functions
add
openAll
closeAll
openTo
Configuration
Functions
add()
Adds a node to the tree.
Can only be called before the tree is drawn.

id, pid and name are required.

Parameters
Name Type Description
id Number Unique identity number.
pid Number Number refering to the parent node. The value for the root node has to be -1.
name String Text label for the node.
url String Url for the node.
title String Title for the node.
target String Target for the node.
icon String Image file to use as the icon. Uses default if not specified.
iconOpen String Image file to use as the open icon. Uses default if not specified.
open Boolean Is the node open.


Example
mytree.add(1, 0, 'My node', 'node.html', 'node title', 'mainframe', 'img/musicfolder.gif');



openAll()
Opens all the nodes.
Can be called before and after the tree is drawn.

Example
mytree.openAll();



closeAll()
Closes all the nodes.
Can be called before and after the tree is drawn.

Example
mytree.closeAll();



openTo()
Opens the tree to a certain node and can also select the node.
Can only be called after the tree is drawn.

Parameters
Name Type Description
id Number Identity number for the node.
select Boolean Should the node be selected.

Example
mytree.openTo(4, true);

Configuration
Variable Type Default Description
target String true Target for all the nodes.
folderLinks Boolean true Should folders be links.
useSelection Boolean true Nodes can be selected(highlighted).
useCookies Boolean true The tree uses cookies to rember it's state.
useLines Boolean true Tree is drawn with lines.
useIcons Boolean true Tree is drawn with icons.
useStatusText Boolean false Displays node names in the statusbar instead of the url.
closeSameLevel Boolean false Only one node within a parent can be expanded at the same time. openAll() and closeAll()
functions do not work when this is enabled.
inOrder Boolean false If parent nodes are always added before children, setting this to true speeds up the tree.

Example
mytree.config.target = "mytarget";

封装的 CSS 和 主要的 JS 在偶的博客上

这里给出
Example
:
example01.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>
	<title>Destroydrop &raquo; Javascripts &raquo; Tree</title>

	<link rel="StyleSheet" href="dtree.css" type="text/css" />
	<script type="text/javascript" src="dtree.js"></script>

</head>

<body>

<h2>__级联菜单__</h2>

<div class="dtree">

	<p><a href="javascript: d.openAll();">全部打开</a> ||| <a href="javascript: d.closeAll();">关闭所有</a></p>

	<script type="text/javascript">
		<!--

		d = new dTree('d');

		d.add(0,-1,'程雨__级联菜单__树型结构');

		d.add(1,0,'Node 1','example01.html');
		d.add(2,0,'Node 2','example01.html');

		d.add(3,1,'Node 1.1','example01.html');
		d.add(4,0,'Node 3','example01.html');
		d.add(5,3,'Node 1.1.1','example01.html');
		d.add(6,5,'Node 1.1.1.1','example01.html');
		d.add(7,0,'Node 4','example01.html');
		d.add(8,1,'Node 1.2','example01.html');
		d.add(9,0,'My Pictures','example01.html','Pictures I\'ve taken over the years','','','img/imgfolder.gif');
		d.add(10,9,'The trip to Iceland','example01.html','Pictures of Gullfoss and Geysir');
		d.add(11,9,'Mom\'s birthday','example01.html');
		d.add(12,0,'Recycle Bin','example01.html','','','img/trash.gif');

		d.add(13,2,'Node 2.1','example01.html');

		document.write(d);

		//-->
	</script>

</div>
<!--
<p><a href="mailto&#58;drop&#64;destroydrop&#46;com">&copy;2002-2003 Geir Landr&ouml;</a></p>
-->
</body>

</html>

明白了各个参数的意思，按部就班，再次面对 树型菜单 我们就可以说 就 OK
这里不是动态的联动 要想做动态的 可以尝试用下 AJAX 很简单的

分享到：

file IO 读取文件夹 | JS 获取父页面值

2010-01-27 11:24
浏览 1254
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

tree 级联菜单__树型结构

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

tree 级联菜单__树型结构

评论

发表评论

相关推荐

SSH Log4j配置

myeclipse控制台不显示tomcat信息

DWR 传递对象--参数 DEMO

DWR 返回集合 demo

DWR 返回对象 DEMO

DWR 例子 -填充 select

textArea 滚动条控制

JSTL 配置中的注意事项

div 弹出层 展示 例子

dwr 例子

柱状图 饼状图 封装

addProduct.js 今天刚写的代码

list转json

addEvent-志愿者-样式

jTab 选项卡

jTab 选项卡

Java 分页 封装类

JS 获取父页面值

win 弹出层

URL 乱码

最近访客更多访客>>

div 弹出层展示例子

柱状图饼状图封装

Java 分页封装类