利用ASP脚本制作异步装载的树形结构（一）.docx

利用ASP脚本制作异步装载的树形结构（一）树形结构是描述层次数据的常见方法本文介绍的树形结构生成程序主要由一个ASP页面二个&avascript函数构成该树形结构是异步的也就是说节点数据仅在必要时才读取而不是一次性全部发送到客户端一概述树形结构中所有的节点都必须包含以下属性本身的ID父节点的ID以及本节点的说明（节点文本）本文用到了一个Access数据库Treemdb来保存这些节点信息Treemdb包含表tblTree其定义如下字段名称类型说明EIementID自动编号节点的唯一标识ParentEIementID数字父节点的IDEIementText文本节点文本本程序利用Treedsn文件定义Treemdb数据源Treedsn内容可以用控制面板中的ODBC数据源配置程序得到内容如下ODBCDRIVER=MicrosoftAccessDriver（*mdb）UID=adminUserCommitSync=YesThreads=SafeTransactions=PageTimeout=MaxScanRows=MaxBufferSize=ImplicitCommitSync=YesFI1.=MSAccessDriverId=DefaultDir=CllnetpubrootDBQ=ClJnetpubrootTreemdb注意运行本文程序时应当修改Treedsn中的DefaUItDir和DBQ使其指向正确的目录和文件客户端功能分两部分实现其一是一个普通的浏览器窗口其二为一个Iframeiframe是不可见的它的作用是负责浏览器窗口与服务器之间的通信下面是示例程序的一个运行界面【图】树形结构各个节点之间的关系可以用Div标记表示如下【图】在这里文档的BODY是第一层节点（divTree）的容器第一层总共包含四个节点这四个节点又分别是其子节点组的容器例如上图中divTree包含了divdivdiv和div（它们分别对应一个节点）而div又是divTree的容器divTree包含了divdivdiv又是divTree的容器而divTree包含了div鼠标单击事件由各个节点本身（divdiv）响应而不是由容器响应节点响应鼠标单击事件后将禁止事件进一步向上（向父节点）传递这部分功能在GetTree函数内实现请参见该函数代码以了解具体实现方法整个树形结构的作用过程可用下图表示【图】二服务器端代码客户端脚本向服务器发送的请求包含了一个节点标识服务器脚本GetTreeDataasp查找数据库获得该节点的所有子字节点并将这些子节点返回给客户程序GetTreeDataasp代码如下：%DimrstTreeDimStrSQ1.DimStrDataIfRequestQueryString（1.evel）=ThenResponseEndEndIfStrSQ1.=SE1.ECT*FROMtblTreeWHEREParentEIementId=StrSQ1.=StrSQ1.&RequestQueryString(1.evel)&ORDERBYEIementIDSetrstTree=ServerCreatebject(ADODBRecordset)rstTreeOpenStrSQ1.FiIeDSN=d:inetpubrootreedsnStrData=DoWhileNotrstTreeEOFStrData=StrData&rstTree(EIementId)&&rstTree(ParentEIementId)&&rstTree(EIementText)&rstTreeMoveNext1.ooprstTreeClose%>< HTM1.>< BODYOn1.oad=parentPopulateTree(<%=strData%>');></BODY></HTM1.>注意在实际使用中应相应地更改DSN文件所在路径这段代码并不复杂但请注意以下两点第一客户请求的格式应该为lishixinzhi/Article/program/net/201404/30517