關於無限分級(ASP+資料庫+JS)的實現代碼_應用技巧

來源:互聯網
上載者:User
代碼可以最佳化,請根據自己需求進行最佳化 
說明:
所先把所有分類讀取存放到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)
%>

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.