代碼可以最佳化,請根據自己需求進行最佳化
說明:
所先把所有分類讀取存放到JS數組中(如果資料量大可能就有點麻煩)
當選擇時候返回父分類ID 在從數組中找出符合的分類,然後顯示給使用者
資料庫設計(可以根據自己需求添加欄位,如此分類屬於什麼分類等等)
欄位 類型 說明
id 自動編號 記錄編號
cotename 文本 分類名稱
byid 數字 父分類ID(即為此表ID,根接點時值為0)
JS部分代碼(命名為*.asp)
複製代碼 代碼如下:
<%Dim conn
Set conn=Server.CreateObject("ADODB.Connection")
conn.ConnectionString = "Provider=Microsoft.Jet.OLEDB.4.0;" & _
"Data Source=" & Server.MapPath("Cote.mdb")
conn.Open
%>
function CheckLm(thevalue){
var byid=new Array();
var cotename=new Array();
var id=new Array();
var i;
var id_s;
var byid_s;
var cotename_s;
var thevalue_r;
var data='<select name="lm" onchange="CheckLm(this.value)">'
id_s="|";
cotename_s='-選擇-|';
<%set rs=server.CreateObject("adodb.recordset")
sql="select * from [DB_Cote] Order by byid,id"
rs.open sql,conn,1,1
i=0
if not rs.eof then
do while not rs.eof
response.Write("id["&i&"]="&rs("id")&";"&chr(10))
response.Write("byid["&i&"]="&rs("byid")&";"&chr(10))
response.Write("cotename["&i&"]='"&rs("cotename")&"';"&chr(10))
rs.movenext
i=i+1
loop
else
response.Write("id[0]=0;byid[0]=0;cotename[0]='無分類';")
end if
rs.close
set rs=nothing%>
if(thevalue==null||thevalue==undefined||thevalue==''){thevalue=0;}
//if(lmvalue==null||lmvalue==undefined||lmvalue==''){lmvalue=0;}
for(k=0;k<id.length;k++){
if(thevalue==id[k]){id_s+=thevalue+"|";cotename_s+=cotename[k]+"|";thevalue_r=byid[k];break;}else{thevalue_r=0;}
}
for(i=0;i<id.length;i++){
if(thevalue==byid[i]){
id_s+=id[i]+"|";cotename_s+=cotename[i]+"|";
}
}
if(id_s=='-1|'){
for(i=0;i<id.length;i++){
if(thevalue==id[i]){
id_s+=id[i]+"|";cotename_s+=cotename[i]+"|";
}
}
}
id_v=id_s.split("|");
cotename_v=cotename_s.split("|");
var length=id_v.length-1;
for(j=0;j<length;j++){
if(thevalue==id_v[j]){
data+="<option value='"+id_v[j]+"' selected>"+cotename_v[j]+"</option>";}
else{
data+="<option value='"+id_v[j]+"'>"+cotename_v[j]+"</option>";
}
}
if(thevalue!=0){data+="<option value='"+thevalue_r+"'>上級分類</option>";}
//alert(length+'/'+thevalue);
var lm=document.getElementById('lmid');
lm.innerHTML=data+"</select>";
}
<%Conn.Close:Set Conn=Nothing%>
調用頁面代碼
複製代碼 代碼如下:
<%
Dim lm
lm=request("lm")
if lm=Empyt or Not Isnumeric(lm) then lm=0
%>
<html>
<script type="text/javascript" src="*.asp"></script>
<body onLoad="CheckLm(<%=lm%>)">
<div id="lmid"></div>
</body>
</html>
運行後結果
<html> <script language="javascript"> function CheckLm(thevalue){ var byid=new Array(); var cotename=new Array(); var id=new Array(); var i; var id_s; var byid_s; var cotename_s; var thevalue_r; var data='<select name="lm" onchange="CheckLm(this.value)">' id_s="|"; cotename_s='-選擇-|'; id[0]=1; byid[0]=0; cotename[0]='大欄目1'; id[1]=7; byid[1]=0; cotename[1]='大欄目2'; id[2]=2; byid[2]=1; cotename[2]='├大欄目1-1'; id[3]=3; byid[3]=1; cotename[3]='├大欄目1-2'; id[4]=4; byid[4]=1; cotename[4]='├大欄目1-3'; id[5]=5; byid[5]=4; cotename[5]='├-大欄目1-3-a'; id[6]=6; byid[6]=4; cotename[6]='├-大欄目1-3-b'; id[7]=10; byid[7]=6; cotename[7]='├--大欄目1-3-b-1'; id[8]=11; byid[8]=6; cotename[8]='├--大欄目1-3-b-2'; id[9]=12; byid[9]=6; cotename[9]='├--大欄目1-3-b-3'; id[10]=8; byid[10]=7; cotename[10]='├大欄目2-1'; id[11]=9; byid[11]=7; cotename[11]='├大欄目2-2'; if(thevalue==null||thevalue==undefined||thevalue==''){thevalue=0;} //if(lmvalue==null||lmvalue==undefined||lmvalue==''){lmvalue=0;} for(k=0;k<id.length;k++){ if(thevalue==id[k]){id_s+=thevalue+"|";cotename_s+=cotename[k]+"|";thevalue_r=byid[k];break;}else{thevalue_r=0;} } for(i=0;i<id.length;i++){ if(thevalue==byid[i]){ id_s+=id[i]+"|";cotename_s+=cotename[i]+"|"; } } if(id_s=='-1|'){ for(i=0;i<id.length;i++){ if(thevalue==id[i]){ id_s+=id[i]+"|";cotename_s+=cotename[i]+"|"; } } } id_v=id_s.split("|"); cotename_v=cotename_s.split("|"); var length=id_v.length-1; for(j=0;j<length;j++){ if(thevalue==id_v[j]){ data+="<option value='"+id_v[j]+"' selected>"+cotename_v[j]+"</option>";} else{ data+="<option value='"+id_v[j]+"'>"+cotename_v[j]+"</option>"; } } if(thevalue!=0){data+="<option value='"+thevalue_r+"'>上級分類</option>";} //alert(length+'/'+thevalue); var lm=document.getElementById('lmid'); lm.innerHTML=data+"</select>"; } </script> <body onLoad="CheckLm(0)"> <div id="lmid"></div> </body> </html>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
資料庫:
遞迴
複製代碼 代碼如下:
Sub GetA(TheID)
set rs=server.CreateObject("adodb.recordset")
dim rs,sql
sql="select * from [DB_Cote] Where ByID in("&TheID&")"
rs.open sql,conn,1,1
i=0
if not rs.eof then
do while not rs.eof
response.Write(rs("cotename")&"<br>")
call GetA(Rs("id"))
rs.movenext
i=i+1
loop
end if
rs.close
set rs=nothing
End Sub
if m=empty then m=0
call GetA(m)
%>