树型下拉框菜单-网页特效--中国素材网

站内搜索

热门特效推荐

树型下拉框菜单

中国素材网 www.sucai86.com 2005-3-31 13:29:49 流量数:

树型下拉框菜单
[查看演示] 源码如下
----------------------------------------------------------------------------------------
<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>

</style>
</head>

<body>

<SCRIPT LANGUAGE="JavaScript">

</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>

<div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand">
<input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div> ----------------------------------------------------------------------------------------
欢迎来到中国素材网!