• <ruby id="5koa6"></ruby>
    <ruby id="5koa6"><option id="5koa6"><thead id="5koa6"></thead></option></ruby>

    <progress id="5koa6"></progress>

  • <strong id="5koa6"></strong>
  • Javascript無限分類算法

    發表于:2007-06-21來源:作者:點擊數: 標簽:
    通過asp 動態生成 js 的數組,然后js在客戶端去排列,最大的減少了服務器端的壓力。(服務器端只是查詢了一次,沒有其他操作) 數據庫設計: id: 索引,自動編號 mc: varchar 100字節,記錄分類名稱 fl: 數字,記錄屬于哪個分類,0為根分類 ceng: 數字,記錄處

       

    通過asp 動態生成 js 的數組,然后js在客戶端去排列,最大的減少了服務器端的壓力。(服務器端只是查詢了一次,沒有其他操作)


    數據庫設計:


      id: 索引,自動編號
      mc: varchar 100字節,記錄分類名稱
      fl: 數字,記錄屬于哪個分類,0為根分類
      ceng: 數字,記錄處于多少層 根分類為0層,以后遞增1


    生成的html代碼如下:


    <html>
    <head>
    <title>fenlei</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    </head>
    <body bgcolor="#FFFFFF" text="#000000">
    <SCRIPT LANGUAGE="javascript">
    <!--
    var dataArray = {};
    var tempArray = {};
    var xx="";
    tempArray[0]="0@_!_#_$_|_@1@_!_#_$_|_@test@_!_#_$_|_@0";tempArray[1]="1@_!_#_$_|_@2@_!_#_$_|_@test1@_!_#_$_|_@1";tempArray[2]="2@_!_#_$_|_@3@_!_#_$_|_@test1-test2@_!_#_$_|_@2";tempArray[3]="0@_!_#_$_|_@4@_!_#_$_|_@test@_!_#_$_|_@0";tempArray[4]="4@_!_#_$_|_@5@_!_#_$_|_@test5@_!_#_$_|_@1";tempArray[5]="2@_!_#_$_|_@6@_!_#_$_|_@aaa@_!_#_$_|_@2";tempArray[6]="2@_!_#_$_|_@7@_!_#_$_|_@sss@_!_#_$_|_@2";
    var y=0;
    function loadNextType(upid){
        for(var key in tempArray){
     var temps=tempArray[key].split("@_!_#_$_|_@");
     var z=temps[1];
      if(temps[0]==upid){
      y+=1;
      xx="";
      for(k=0;k<parseInt(temps[3]);k++){
      if(k!=parseInt(temps[3])-1){
      xx+="&nbsp;";
      }else{
      xx+="&nbsp;◇";
      }
      }
      dataArray[y]=temps[0]+"@_!_#_$_|_@"+temps[1]+"@_!_#_$_|_@"+xx+temps[2];
      loadNextType(z);
      }
     }
    }
    for(var key in tempArray){
    var tmp=tempArray[key].split("@_!_#_$_|_@");
     if(tmp[0]==0){
      dataArray[y]=tmp[0]+"@_!_#_$_|_@"+tmp[1]+"@_!_#_$_|_@"+"◆"+tmp[2];
      loadNextType(tmp[1]);
      y+=1;
     }
    }
    //-->
    </SCRIPT>
    <span style="border:1px solid #000000; position:absolute; overflow:hidden;" >
    <select name="fenlei" style="margin:-2px;">
      <SCRIPT LANGUAGE="javascript">
    <!--
    for(var key in dataArray){
    var tp=dataArray[key].split("@_!_#_$_|_@");
    document.write('<option value='+tp[1]+'>'+tp[2]+'</option>');
    }
    //-->
    </SCRIPT>
    </select></span>
    </body>
    </html>
    服務器端asp代碼如下:


    <!--#include file="../conn.asp"-->
    <!--#include file="ck.asp"-->
    <html>
    <head>
    <title>fenlei</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    </head>
    <body bgcolor="#FFFFFF" text="#000000">
    <SCRIPT LANGUAGE="javascript">
    <!--
    var dataArray = {};
    var tempArray = {};
    var xx="";
    <%
    dim sql
    Set rs=server.createobject("adodb.recordset")
    sql="select * from fenlei"
    rs.open sql,conn,1,1
    dim x
    x=0
    do while not rs.eof
    response.write "tempArray[" & x & "]=""" &rs("fl") & "@_!_#_$_|_@" &rs("id") & "@_!_#_$_|_@" & rs("mc") & "@_!_#_$_|_@" & rs("ceng") & """;"
    x=x+1
    rs.movenext
    loop
    %>
    var y=0;
    function loadNextType(upid){
        for(var key in tempArray){
     var temps=tempArray[key].split("@_!_#_$_|_@");
     var z=temps[1];
      if(temps[0]==upid){
      y+=1;
      xx="";
      for(k=0;k<parseInt(temps[3]);k++){
      if(k!=parseInt(temps[3])-1){
      xx+="&nbsp;";
      }else{
      xx+="&nbsp;◇";
      }
      }
      dataArray[y]=temps[0]+"@_!_#_$_|_@"+temps[1]+"@_!_#_$_|_@"+xx+temps[2];
      loadNextType(z);
      }
     }
    }
    for(var key in tempArray){
    var tmp=tempArray[key].split("@_!_#_$_|_@");
     if(tmp[0]==0){
      dataArray[y]=tmp[0]+"@_!_#_$_|_@"+tmp[1]+"@_!_#_$_|_@"+"◆"+tmp[2];
      loadNextType(tmp[1]);
      y+=1;
     }
    }
    //-->
    </SCRIPT>
    <span style="border:1px solid #000000; position:absolute; overflow:hidden;" >
    <select name="fenlei" style="margin:-2px;">
      <SCRIPT LANGUAGE="javascript">
    <!--
    for(var key in dataArray){
    var tp=dataArray[key].split("@_!_#_$_|_@");
    document.write('<option value='+tp[1]+'>'+tp[2]+'</option>');
    }
    //-->
    </SCRIPT>
    </select></span>
    </body>
    </html>
    講解:


      asp 查詢數據庫,生成js數據 object(不是數組,類似)
      數據庫不同的行,對應不同的 tempArray[0] tempArray[1]......
      不同字段在每條數據中通過"@_!_#_$_|_@"分割,以避免會與數據中的文本有重復。


      用js通過遞歸算法重新排列tempArray 得到dataArray 并循環打印成為select中的option



     

    原文轉自:http://www.kjueaiud.com

    老湿亚洲永久精品ww47香蕉图片_日韩欧美中文字幕北美法律_国产AV永久无码天堂影院_久久婷婷综合色丁香五月

  • <ruby id="5koa6"></ruby>
    <ruby id="5koa6"><option id="5koa6"><thead id="5koa6"></thead></option></ruby>

    <progress id="5koa6"></progress>

  • <strong id="5koa6"></strong>