＋设为首页 ＋添加到收藏夹
原文出自：http://www.9499.net?go=tc，阿赖原作
摘要：本文介绍阿赖javascript目录树控件程序的设计与应用。想了解更多请点这里，想下载控件程序与教程请点这里。 【相关文章:使用.NET自带的类实现DataGrid】
关键字：web控件 目录树菜单 树型菜单 树形目录 javascript编程 【扩展阅读:Batch Telnet (Telnet】
之前我曾经使用asp设计过生成目录树的程序，那就是open host系统的目录树，完成于2003年1月份，在此之前浏览过www.9499.net的朋友对此一定有印象。如今使用javascript设计的这个目录树控件程序方法上与asp有很大的差别，可以说难度更大，使用上更具灵活性，它是目前功能最强使用最简便的目录树程序。关于这个目录树控的功能特性方面，以下几点值得一提： 【扩展信息:有趣的sql(4) - 关于注释的，续&】 阿赖目录树控件程序简介 一、引入了图片控件与目录树控件配合使用，大大提高了灵活性。这一点上主要参考了vb6的treeview控件。 二、在控件程序中引入了事件处理机制，增强了功能，也大大提高了使用的灵活性。 三、提供了大量的对象接口与方法。 四、提供了多种添加目录树节点的方法，有add方法，addlink方法，以及独创的pathparse方法(用来解析路径列表，以最简单的代码快速的构造目录树)。 五、目录树样式不受限制，用户完全可以设计出风格各异，灵活多变的目录树来。 六、提供多种现成的目录树模板，用户不必再费心去设计目录树样式，只需选取喜欢的模板，添加树节点即可，多快好省！ 七、控件程序可根据需要进行功能扩展，目前提供checkbox节点扩展程序(alai_tree_check.js)就是一个很好的范例。i. 概述：
阿赖目录树控件程序完全采用面向对象的方法设计，整个程序封装一个函数alai_tree()里面，另外随目录树程序提供了一个图片列表imagelist控件(alai_imagelist())。使用阿赖目录树控件程序构建目录树一般遵循以下三个步骤：
一、建立imagelist实例对象，并向控件添加建目录树所需的图片；
二、新建一个目录树控件实例，将上述imagelist实例对象作为第一个参数传递；
三、调用目录树控件的各种对象、方法，添加节点，定义事件处理程序等。
当然我们有更便捷的方法，就是使用现有的目录树模板程序以更简化的步骤来构建目录树，关于模板程序搁后再谈。在建立目录树前我先来理解目录树控件的三个核心对象：
（1）目录树控件实例对象（tree），如下：
var tree=new alai_tree()
这样就新建了一个树对象。
（2）根(root)对象：tree.root，可以看出它是tree的一个成员，它是没有外观表现的，用于构建目录树第一级的节点，是第一级节点的父对象(parent)。
（3）节点(node)对象，对应于目录树上的一个节点，如下：
var node=tree.add(...) //添加节点，参数先省略不谈
上面调用目录添加节点的方法，生成了一个新的节点对象：node
这三个对象各自拥有很多的成员对象（属性、方法与事件），具体请查看«目录树控件对象参考»。接下举个例子，来看看构键目录树的过程：
ii. 示例程序：
var images=new alai_imagelist() //建立imagelist实例对象
images.path="images/" //图片路径
images.add("file.gif","default") //添加图片，第二个参数是键值(key)
images.add("folder") //添加图片，文件后缀".gif"省了，键值缺省取文件名："folder"
images.add("html","link") //添加html.gif，键值为link
... 下一页