欢迎你的访问
 
返回天空素材库首页 http://www.Skysucai.com  
收藏本站
将本站设为首页
您当前的位置:天空素材首页 -> 树型下拉框菜单
 
栏 目 导 航
. 常用代码 . 综合特效
. 状态特效 . 游戏特效
. 页面背景 . 页面特效
. 页面导航 . 文本操作
. 文本特效 . 图形特效
. 鼠标特效 . 时间日期
. 密码特效 . 浏览相关
. 警告对话 . 技巧特效
. 计数转换 . 测试搜索
. 代码生成 . 播放音乐
. 按钮特效 . 系统相关
. 链接特效 . 黑客性质
. 相关特效 . 窗口特效
. 广告特效 . 表单表格
. 模拟例子
相 关 文 章
本 类 热 门
· 各省城市
· 可以编辑的select
· 从select选择中新开的...
· 三级关联菜单
· 移动下拉框
· 显示全部Option的Sele...
· 动态提示的下拉框
· 树型下拉框菜单
· 省市县关联菜单
· 可控制的闪烁链接
· 广告脚本
· 一个很爽的公告栏
更多  
 
 
更多  
最 新 推 荐
· 状态栏时间跳动特效
· 农历挂历特效
· 真正的万年历
· 网页特效 菜单-会动的...
· 网页特效 时间-任意位...
· 个人网页特效-有前后日...
· 时间每过一秒,Radio就...
· 时钟显示在任意指定位...
· 带开关的Form时钟
· 记录几天后的日期
· 显示登陆时间
· 退出时显示访问时间
更多  
     
树型下拉框菜单
树型下拉框菜单
作者:无  来源:本站整理  名称:树型下拉框菜单 

减小字体 增大字体

       

[提示:你可先按照下面代码提示修改 上面部分代码,再按运行,此处看到的演示不完全正确]

此特效的详细完整代码如下:
]  源码如下
----------------------------------------------------------
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="Keywords" content="51windows.Net">
<META NAME="Author" CONTENT="haiwa">
<title>树型下拉框菜单(数据库版)-www.51windows.Net</title>
<style>
<!--
* {font:menu}
-->
</style>
</head>

<body>

<SCRIPT LANGUAGE="JavaScript">
<!--
/****************************************************
* 原作者:Fason(阿信)[蒲佛信]*
* http://fason.nease.net/ *
* pufoxin@hotmail.com*
* ---------------------------------------------*
* 数据库版修改:51windows(海娃)*
* http://www.51windows.Net*
****************************************************/
var select_value = ""
function TreeView(obj,target){
this.obj=obj;
this.root=new node(0);
this.nodes=[]
this.currentNode=null;
this.html=""
this.config={

blank:'┣━',
line:'┣━'
}
for(i in this.config){var tem=this.config[i];this.config[i]=new Image();this.config[i].txt=tem}
}

function node(id,pid,txt){
this.id=id
this.pid=pid
this.txt=txt
this.indent=""
this.open=false;
this.lastNode=false;
this.hasNode=false
}


TreeView.prototype.add=function(id,pid,txt){
var itemTxt=txt?txt:"New Item"
this.nodes[this.nodes.length]=new node(id,pid,itemTxt)
}

TreeView.prototype.DrawTree=function(pNode){
var str=""
for(var i=0;i<this.nodes.length;i++){
if(this.nodes[i].pid==pNode.id){
str+=this.DrawNode(this.nodes[i].id,i)
}
}
return str
}

TreeView.prototype.ChkPro=function(pNode){
var last;
for(var n=0;n<this.nodes.length;n++){
if(this.nodes[n].pid==pNode.id)pNode.hasNode=true;
if (this.nodes[n].pid == pNode.pid) last= this.nodes[n].id;
}
if (last==pNode.id) pNode.lastNode = true;
}

TreeView.prototype.DrawNode=function(id,nid){
var str=""
var select_ed = ""
var nNode=this.nodes[nid]
this.DrawLine(nNode,nNode)
if(nNode.hasNode)
nNode.indent+=(nNode.hasNode?"":"")
if (select_value==id){select_ed = "selected"}else{select_ed = "";}
str+="<option value="+id+" "+select_ed+">"+nNode.indent+this.DrawLink(nid)+"</option>"
if(nNode.hasNode){
str+=this.DrawTree(nNode)
}
return str;
}


TreeView.prototype.DrawLine=function(nNode,tem){
for(var i=1;i<this.nodes.length;i++){
if(this.nodes[i].id==tem.pid){
nNode.indent=(this.nodes[i].lastNode?this.config.blank.txt:this.config.line.txt)+nNode.indent
this.DrawLine(nNode,this.nodes[i])
}
}
}
TreeView.prototype.DrawLink=function(nid){
var nNode=this.nodes[nid]
return nNode.txt
}

TreeView.prototype.toString=function(){
var str=""
for(var i=0;i<this.nodes.length;i++)this.ChkPro(this.nodes[i])
str+=this.DrawTree(this.root)
return str
}

var a=new TreeView('a','main')
a.add(2,0,'我的文档');
a.add(3,0,'我的电脑');
a.add(4,0,'网上邻居');
a.add(5,0,'回收站');
a.add(6,3,'C:');
a.add(7,6,'Windows');
a.add(8,7,'System32');
a.add(9,8,'Temp');
document.write("<select name='<% = select_name %>'>"+a+"</select>");
//-->
</SCRIPT>

<p align="center"><textarea rows="20" name="S1" cols="90" style="width:95%;height:80%;"><%
'使用方法<SCRIPT LANGUAGE="JavaScript" src="dbselect.asp?s_v=1"></SCRIPT>
dim db_id,db_pid,db_text,db_table,select_name,select_value,dbpath
db_id= "id"'主id
db_pid= "pid"'父ID
db_text= "name"'名
db_table= "Folder"'表名
select_name= "Folder"'下拉菜单名
select_value= trim(request("s_v"))'值
dbpath= "mdb.asp"'数据库名
set conn=Server.CreateObject("ADODB.Connection")
conn.Open "Provider=Microsoft.Jet.OLEDB.4.0;Jet OLEDB:Database Password=;Data Source="&Server.MapPath(dbpath)
set rs=Server.CreateObject("ADODB.Recordset")
%>
/****************************************************
* 原作者:Fason(阿信)[蒲佛信]
* http://fason.nease.net/
* pufoxin@hotmail.com
* ---------------------------------------------
* 数据库版修改:51windows(海娃)
* http://www.51windows.Net
****************************************************/
var select_value = "<% = select_value %>"
function TreeView(obj,target){
this.obj=obj;
this.root=new node(0);
this.nodes=[]
this.currentNode=null;
this.html=""
this.config={

blank:'┣━',
line:'┣━'
}
for(i in this.config){var tem=this.config[i];this.config[i]=new Image();this.config[i].txt=tem}
}

function node(id,pid,txt){
this.id=id
this.pid=pid
this.txt=txt
this.indent=""
this.open=false;
this.lastNode=false;
this.hasNode=false
}


TreeView.prototype.add=function(id,pid,txt){
var itemTxt=txt?txt:"New Item"
this.nodes[this.nodes.length]=new node(id,pid,itemTxt)
}

TreeView.prototype.DrawTree=function(pNode){
var str=""
for(var i=0;i<this.nodes.length;i++){
if(this.nodes[i].pid==pNode.id){
str+=this.DrawNode(this.nodes[i].id,i)
}
}
return str
}

TreeView.prototype.ChkPro=function(pNode){
var last;
for(var n=0;n<this.nodes.length;n++){
if(this.nodes[n].pid==pNode.id)pNode.hasNode=true;
if (this.nodes[n].pid == pNode.pid) last= this.nodes[n].id;
}
if (last==pNode.id) pNode.lastNode = true;
}

TreeView.prototype.DrawNode=function(id,nid){
var str=""
var select_ed = ""
var nNode=this.nodes[nid]
this.DrawLine(nNode,nNode)
if(nNode.hasNode)
nNode.indent+=(nNode.hasNode?"":"")
if (select_value==id){select_ed = "selected"}else{select_ed = "";}
str+="<option value="+id+" "+select_ed+">"+nNode.indent+this.DrawLink(nid)+"</option>"
if(nNode.hasNode){
str+=this.DrawTree(nNode)
}
return str;
}


TreeView.prototype.DrawLine=function(nNode,tem){
for(var i=1;i<this.nodes.length;i++){
if(this.nodes[i].id==tem.pid){
nNode.indent=(this.nodes[i].lastNode?this.config.blank.txt:this.config.line.txt)+nNode.indent
this.DrawLine(nNode,this.nodes[i])
}
}
}
TreeView.prototype.DrawLink=function(nid){
var nNode=this.nodes[nid]
return nNode.txt
}

TreeView.prototype.toString=function(){
var str=""
for(var i=0;i<this.nodes.length;i++)this.ChkPro(this.nodes[i])
str+=this.DrawTree(this.root)
return str
}

var a=new TreeView('a','main')
<%
dim select_sql
select_sql = "Select " & db_id & "," & db_pid & "," & db_text & " from [" & db_table & "]"
Set rs = Conn.Execute(select_sql)
While rs.EOF =flase
Thisid=rs(db_id)
%>
a.add(<%=rs(db_id)%>,<%=rs(db_pid)%>,'<%=rs(db_text)%>');<%
rs.MoveNext
Wend
rs.close
Set rs=nothing
conn.close
Set conn=nothing
%>
document.write("<select name='<% = select_name %>'>"+a+"</select>");</textarea></p>
</body>
</html>
[返回上一页] [打印树型下拉框菜单]
上一篇特效:省市县关联菜单
下一篇特效:动态提示的下拉框
     
| 关于本站 | 服务条款 | 友情连接 | 网站地图 | 联系方式 | 广告联系 |