JavaScript實現二級、多級(N級)聯動下拉式清單方塊資料庫版

資料庫是最常用的那種結構：id,parentid,content三個欄位
asp檔案片段：
<script language="JavaScript" type="text/JavaScript" src="../../javascript/cs.js"></script>
<script language="JavaScript" type="text/javascript">
var aryPType = [
<%
set myrs = server.createobject("adodb.recordset")
    myrs.source = "select id,content,parentid from deeptree order by id "
    'response.Write(myrs.source)
    'response.End()
    myrs.open myrs.source,conn,1,1
    for k=1 to myrs.recordcount
%>

[<%=myrs("parentid")%>,'<%=myrs("content")%>',<%=myrs("id")%>]<%if k<myrs.recordcount  then response.Write(",") end if%>

<%
myrs.movenext
next
%>
]
/*
文檔載入完成時給控制項載入自訂屬性
subElement:    可選的。指定一個子物件，必須為一個HTML Select控制項　
selectedValue: 可選的。指定選定的值，在回顯示時非常方便
defaultText:   可選的。預設文本
defaultValue:  可選的。預設值
最佳化的好處：
一、集中到Script裡，方便管理
二、防止一些編輯器報告討厭的XX標準不支援此屬性的警告
三、讓網頁通過標準驗證
*/
window.onload = function(){
  form = document.forms[0];
 
  form.selP1.setAttribute("subElement", "selP2");
  form.selP2.setAttribute("subElement", "selP3");
  form.selP3.setAttribute("subElement", "Lsort");
 
//  setupCascadeSelect(form.selP1, 0, aryPType, false);
new CascadeSelect(form.selP1, "0", aryPType);
}
</script>
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
這個我在寫一個電腦城的報價系統時做的，實際項目中用是用兩個迴圈嵌套的，因為經銷商只是添加指定類別，所以不用全都取出來。實際產生的js數組如下
var aryPType = [
[0,'整機',365],

[365,'筆記本',379],
[365,'筆記本配件',380],
[365,'台式機',381],
[365,'伺服器',382],
[365,'伺服器配件',457],
[365,'工作站',458],
[365,'小型機',459],
[365,'移動PC',460],
[365,'平板電腦',461],
[365,'網路電腦',462],

[0,'通訊裝置',366],

[366,'手機',383],
[366,'集團電話',384],
[366,'對講機',385],
[366,'電話錄音系統',386],
[366,'錄音電話',387],
[366,'電話交換器',443],
[366,'GPS裝置',444],
[366,'反測速雷達',445],
[366,'電話錄音卡',446],
[366,'小靈通',463],
[366,'電話機',464],
[366,'voip網關',465],
[366,'話務中心',466],
[366,'手機配件',467],

[0,'數位',367],

[367,'數位相機',388],
[367,'MP3播放器',389],
[367,'MP4播放器',468],
[367,'數字采編系統',469],
[367,'鏡頭濾鏡',470],
[367,'數位相機伴侶',471],
[367,'MD播放器',472],
[367,'數位攝像機',473],
[367,'數位網路攝影機',474],
[367,'數位錄音筆',475],
[367,'多媒體硬碟播放',476],
[367,'電子書',477],
[367,'掌上型電腦配件',478],
[367,'數位配件',479],
[367,'數位學習機',480],
[367,'掌上型電腦',481],
[367,'便攜DVD',482],

[0,'配件',368],

[368,'CPU',391],
[368,'主板',392],
[368,'視訊卡',402],
[368,'DVD燒錄機',483],
[368,'DVD-ROM',484],
[368,'滑鼠',485],
[368,'機箱',486],
[368,'記憶體',487],
[368,'顯卡',488],
[368,'LCD顯示器',489],
[368,'COMBO',490],
[368,'CD-ROM',491],
[368,'電源',492],
[368,'硬碟',493],
[368,'音效卡',494],
[368,'CRT顯示器',495],
[368,'CD-RW燒錄機',496],
[368,'鍵盤',497],
[368,'耳機',498],
[368,'散熱器',499],
[368,'音箱',500],
[368,'MO磁光碟片機',501],
[368,'遠端控制器',502],
[368,'滑鼠墊',503],
[368,'轉接與數字線',504],

[368,'CPU',391],

[391,'AMD(AMD)',435],
[391,'英特爾(Intel)',436],
[391,'數控滑台',437],
[391,'鋼導軌',438],

[368,'主板',392],

[392,'昂達(ON-DATA)',410],
[392,'超微(Supermicro)',411],
[392,'頂星(Topstar)',412],
[392,'富士康',413],
[392,'冠盟',417],
[392,'冠通',418],
[392,'冠盈',419],
[392,'艾崴(Iwil)',439],
[392,'冠譽',645],
[392,'華擎(ASRock)',646],
[392,'華碩(Asus)',647],
[392,'技嘉(Gigabyte)',648],
[392,'捷波(Jetway)',649],
[392,'精威(PCCHIPS)',650],
[392,'精英(ECS)',651],
[392,'梅捷',652],
[392,'磐英',653],
[392,'磐正(Epox)',654],
[392,'七彩虹(seethru)',655],
[392,'升技(Abit)',656],
[392,'雙敏(UNIKA)',657],
[392,'碩泰克(Soltek)',658],
[392,'斯巴達克',659],
[392,'泰安(TYAN)',660],
[392,'微星(MSI)',661],
[392,'翔升',662],
[392,'信洋(xinyang)',663],
[392,'英特爾(Intel)',664],
[392,'盈通',665],
[392,'映泰(Biostar)',666],
[392,'致銘',667],
[392,'鑽石(DFI)',668],
[392,'雋星(MBI)',669],

[368,'視訊卡',402],

[402,'ADS',670],
[402,'MATROX',671],
[402,'Osprey',672],
[402,'百老會',673],
[402,'寶獅',674],
[402,'好萊塢製片人',675],
[402,'康博(COMPRO)',676],
[402,'康能普視',677],
[402,'朗視',678],
[402,'美如畫',679],
[402,'品尼高',680],
[402,'天敏',681],
[402,'友立(Ulead)',682],
[402,'圓剛',683],

[0,'軟體',447],

[447,'作業系統',505],
[447,'辦公軟體',506],
[447,'安防殺毒',507],
[447,'財務及管理軟體',508],
[447,'開發軟體',509],
[447,'映像軟體',510],
[447,'排版軟體',511],
[447,'資料庫和中介軟體',512],
[447,'網路管理軟體',513],

[0,'移動儲存',448],

[448,'快閃記憶卡',514],
[448,'快閃記憶體盤',515],
[448,'移動硬碟',516],
[448,'數位伴侶',517],
[448,'讀卡機',518],
[448,'移動硬碟盒',519],

[0,'語音視頻',449],

[449,'視頻會議',520],
[449,'多媒體視頻',521],
[449,'電教裝置',522],
[449,'分配器',523],
[449,'視訊卡',524],
[449,'矩陣切換器',525],
[449,'中央控制系統',526],
[449,'網路攝像機',527],
[449,'音訊會議',528],

[0,'耗材',450],

[450,'墨盒',529],
[450,'碳粉',530],
[450,'硒鼓',531],
[450,'連續供墨系統',532],
[450,'紙張',533],
[450,'塑封膜',534],
[450,'碟片',535],

[0,'辦公外設',451],

[451,'投影機',536],
[451,'UPS',537],
[451,'投影螢幕',538],
[451,'雷射印表機',539],
[451,'噴墨印表機',540],
[451,'條碼印表機',541],
[451,'大幅印表機',542],
[451,'針式印表機',543],
[451,'印表機配件',544],
[451,'數字化儀',545],
[451,'傳真機',546],
[451,'複印機',547],
[451,'多功能一體機',548],
[451,'掃描器',549],
[451,'條碼掃描器',550],
[451,'手寫輸入',551],
[451,'展示台',552],
[451,'電子白板',553],
[451,'點鈔機',554],
[451,'穩壓電源',555],
[451,'裝訂機',556],
[451,'塑封機',557],
[451,'碎紙機',558],
[451,'考勤/收費系統',559],
[451,'標籤印表機',560],
[451,'光碟片拷貝機',561],
[451,'投影機燈泡',562],
[451,'列印伺服器',563],
[451,'證卡印表機',564],
[451,'熱升華印表機',565],

[0,'網路裝置',452],

[452,'交換器',566],
[452,'伺服器',567],
[452,'網卡',568],
[452,'功能伺服器',569],
[452,'SCSI硬碟',570],
[452,'磁帶機',571],
[452,'集線器',572],
[452,'磁帶',573],
[452,'硬體防火牆',574],
[452,'RAID控制卡',575],
[452,'SCSI控制卡',576],
[452,'磁碟陣列',577],
[452,'網路安全產品',578],
[452,'多串口卡',579],
[452,'路由器',580],
[452,'數據機',581],
[452,'模組介面卡',582],
[452,'NAS網路儲存空間',583],
[452,'轉換器',584],
[452,'收發器',585],
[452,'KVM切換器',586],
[452,'網路延長器',587],

[0,'顯示裝置',453],

[453,'投影機',588],
[453,'CRT顯示器',589],
[453,'液晶顯示器',590],

[0,'機房布線',454],

[454,'測試儀',591],
[454,'機房布線',592],
[454,'機房空調',593],
[454,'機櫃',594],

[0,'無線網',455],

[455,'無線上網卡',595],
[455,'無線網卡',596],
[455,'無線路由器',597],
[455,'無線存取點',598],
[455,'無線橋接器',599],
[455,'藍芽適配器',600],
[455,'功率放大器',601],
[455,'天饋系統',602],
[455,'無線網關',603],
[455,'藍芽產品',604],

[0,'其他',456],

[456,'遊戲機',605],
[456,'遊戲周邊',606],
[456,'電池',607],
[456,'電腦鎖',608],
[456,'望遠鏡',609],
[456,'防輻射',610],
[456,'音響',611],
[456,'診斷卡',612],
[456,'數字卡',613],

[368,'DVD燒錄機',483],

[483,'三星(SAMSUNG)',684],
[483,'飛利浦(PHILIPS)',685],
[483,'DGC',686],
[483,'LG',687],
[483,'NEC',688],
[483,'ORBBIT精英',689],
[483,'nu',690],
[483,'阿帕奇',691],
[483,'愛國者(aigo)',692],
[483,'昂達(ONDA)',693],
[483,'奧格賽(ARGOSY)',694],
[483,'廣禹',695],
[483,'華碩(ASUS)',696],
[483,'惠普(HP)',697],
[483,'技嘉',698],
[483,'建基(AOpen)',699],
[483,'建興',700],
[483,'萊希(LACIE)',701],
[483,'理光(Ricoh)',702],
[483,'明基(BenQ)',703],
[483,'摩西',704],
[483,'浦科特(Plextor)',705],
[483,'松下(Panasonic)',706],
[483,'索尼(SONY)',707],
[483,'台電(TECLAST)',708],
[483,'微星(MSI)',709],
[483,'先鋒(Pioneer)',710],
[483,'映派',711],
[483,'志美',712],

[368,'DVD-ROM',484],

[484,'三星(SAMSUNG)',713],
[484,'飛利浦(PHILIPS)',714],
[484,'DGC',715],
[484,'LG',716],
[484,'NEC',717],
[484,'ORBBIT精英',718],
[484,'nu',719],
[484,'阿帕奇',720],
[484,'愛國者(aigo)',721],
[484,'昂達(ONDA)',722],
[484,'奧格賽(ARGOSY)',723],
[484,'廣禹',724],
[484,'華碩(ASUS)',725],
[484,'惠普(HP)',726],
[484,'技嘉',727],
[484,'建基(AOpen)',728],
[484,'建興',729],
[484,'萊希(LACIE)',730],
[484,'理光(Ricoh)',731],
[484,'明基(BenQ)',732],
[484,'摩西',733],
[484,'浦科特(Plextor)',734],
[484,'松下(Panasonic)',735],
[484,'索尼(SONY)',736],
[484,'台電(TECLAST)',737],
[484,'微星(MSI)',738],
[484,'先鋒(Pioneer)',739],
[484,'映派',740],
[484,'志美',741],

[368,'滑鼠',485],

[485,'飛利浦(Philips)',742],
[485,'IBM(IBM)',743],
[485,'NEC',744],
[485,'Razer',745],
[485,'愛國者(aigo)',746],
[485,'方正(founder)',747],
[485,'漢王',748],
[485,'黑貂',749],
[485,'惠普(HP)',750],
[485,'技嘉(GIGABYTE)',751],
[485,'金翔',752],
[485,'靈標(Microalert)',753],
[485,'羅技(Logitech)',754],
[485,'麥拓',755],
[485,'明基(BenQ)',756],
[485,'摩西',757],
[485,'三星(SAMSUNG)[',758],
[485,'雙飛燕',759],
[485,'索尼(SONY)',760],
[485,'微軟(Microsoft)',761],
[485,'新貴(Newmen)',762],
[485,'優派(ViewSonic)',763],

[368,'機箱',486],

[486,'Thermaltake',764],
[486,'愛國者(aigo)',765],
[486,'百事得',766],
[486,'超微',767],
[486,'富士康',768],
[486,'航嘉',769],
[486,'惠科',770],
[486,'技嘉',771],
[486,'金河田',772],
[486,'聯志',773],

[368,'記憶體',487],

[487,'HP',774],
[487,'RAMBO',775],
[487,'RAMOS',776],
[487,'富豪(Fuhao)',777],
[487,'海盜船',778],
[487,'黑金剛(Kingbox)',779],
[487,'金邦(GEIL)',780],
[487,'金士頓(Kingston)',781],
[487,'金士剛',782],
[487,'金泰克(KINGTIGER)',783],
[487,'勤茂(TwinMOS)',784],
[487,'三星(Samsung)',785],
[487,'勝創Kingmax(KINGMAX)',786],
[487,'威剛',787],
[487,'現代',788],
[487,'宇瞻',789],
[487,'麒侖',790],

[368,'顯卡',488],

[488,'3DLABS',791],
[488,'HIS',792],
[488,'MATROX(MATROX)',793],
[488,'艾爾莎(ELSA )',794],
[488,'昂達(ON-DATA)',795],
[488,'佰特',796],
[488,'承啟',797],
[488,'迪蘭恒進(dataland)',798],
[488,'鋒尚',799],
[488,'富彩',800],
[488,'冠通',801],
[488,'冠盈',802],
[488,'華碩',803],
[488,'技嘉',804],
[488,'捷波',805],
[488,'藍寶石',806],
[488,'麗台',807],
[488,'美達',808],
[488,'銘瑄',809],
[488,'磐正',810],
[488,'七彩虹(seethru)',811],
[488,'雙敏(UNIKA)',812],
[488,'碩泰克',813],
[488,'斯巴達克',814],
[488,'太陽花',815],
[488,'萬麗',816],
[488,'微星',817],
[488,'翔升',818],
[488,'小影霸',819],
[488,'訊景',820],
[488,'盈通',821],
[488,'影馳(GALAXY)',822],
[488,'映泰',823],
[488,'映眾(Inno3D)',824],
[488,'宇派',825],
[488,'旌宇',826],
[488,'祺祥',827],

[368,'LCD顯示器',489],

[489,'ADI(ADI)',828],
[489,'IBM(IBM)',829],
[489,'LG(LG)',830],
[489,'NEC(NEC)',831],
[489,'NESO(NESO)',832],
[489,'TOPVIEW',833],
[489,'愛國者(Aigo)',834],
[489,'戴爾(DELL)',835],
[489,'飛利浦(PHILIPS)',836],
[489,'格朗特',837],
[489,'冠捷(AOC)',838],
[489,'宏碁(Acer)',839],
[489,'華碩(ASUS)',840],
[489,'惠普(HP)',841],
[489,'惠浦(HPC)',842],
[489,'金長城(GreatWall)',843],
[489,'康冠(KTC)',844],
[489,'聯想QDI',845],
[489,'瑪思特',846],
[489,'瑪雅',847],
[489,'美格(MAG)',848],
[489,'美樂(MEILE)',849],
[489,'美齊',850],
[489,'明基(BenQ)',851],
[489,'南方高科(Soutec)',852],
[489,'賽普特(Sceptre)',853],
[489,'三星(SUMSUNG)',854],
[489,'神州數位(digitalchina)',855],
[489,'索尼(SONY)',856],
[489,'田浦(viva)',857],
[489,'唯冠(EMC)',858],
[489,'夏普(SHARP)',859],
[489,'藝卓(EIZO)',860],
[489,'易美遜(Envision)',861],
[489,'優派(ViewSonic)',862],
[489,'中科先拓',863],
[489,'瀚視奇(HannsG)',864],

[368,'COMBO',490],

[490,'三星(Samsung',865],
[490,'IBM(IBM)',866],
[490,'LG(LG)',867],
[490,'ORBBIT精英',868],
[490,'阿帕奇',869],
[490,'愛國者(aigo)',870],
[490,'昂達(ONDA)',871],
[490,'奧格賽(ARGOSY)',872],
[490,'百事靈(BUSLink)',873],
[490,'城市駱駝',874],
[490,'大白鯊',875],
[490,'華碩(Asus)',876],
[490,'惠普(HP)',877],
[490,'技嘉',878],
[490,'建基',879],
[490,'建興',880],
[490,'明基(BENQ)',881],
[490,'摩西',882],
[490,'雙敏(UNIKA)',883],
[490,'松下(Panasonic)',884],
[490,'索尼(SONY)',885],
[490,'台電(TECLAST)',886],
[490,'先鋒(Pioneer)',887],
[490,'易科(eke)',888],
[490,'映派',889],
[490,'源興',890],
[490,'志美',891],
[490,'啄木鳥',892],

[368,'CD-ROM',491],

[491,'Acer',630],
[491,'LG',631],
[491,'MITSUMI',632],
[491,'愛國者',633],
[491,'昂達',634],
[491,'飛利浦',635],
[491,'聯想',636],
[491,'美達',637],
[491,'美格',638],
[491,'明基',639],
[491,'三星',640],
[491,'索尼',641],
[491,'台電',642],
[491,'微星',643],
[491,'優百特',644],

[368,'電源',492],

[492,'thermaltake',893],
[492,'長城',894],
[492,'傳旗',895],
[492,'大水牛',896],
[492,'航嘉',897],
[492,'惠科',898],
[492,'金河田',899],
[492,'九州風神',900],
[492,'七盟',901],
[492,'全漢(FSP)',902],
[492,'世紀之星',903],
[492,'鑫穀',904],

[368,'硬碟',493],

[493,'邁拓(Maxtor)',905],
[493,'日立(HITACHI)',906],
[493,'三星(Samsung)',907],
[493,'西部資料(Western Digital)',908],
[493,'希捷',909],

[368,'音效卡',494],

[494,'創新(CREATIVE)',910],
[494,'德國坦克',911],
[494,'黑金',912],
[494,'樂之邦(DIYEDEN)',913],
[494,'瑪雅(MAMY)',914],
[494,'啟亨',915],

[368,'CRT顯示器',495],

[495,'CTX(CTX)',916],
[495,'EMC',917],
[495,'LG(LG)',918],
[495,'MV美麗瓏',919],
[495,'NEC(NEC)',920],
[495,'NESO(NESO)',921],
[495,'TCL',922],
[495,'愛達(ADM)',923],
[495,'愛國者(Aigo)',924],
[495,'大水牛',925],
[495,'飯山(iiyama)',926],
[495,'方正(founder)',927],
[495,'飛利浦 (PHILIPS)',928],
[495,'冠捷(AOC)',929],
[495,'海爾(Haier)',930],
[495,'宏碁(Acer)',931],
[495,'幻象',932],
[495,'惠科(MicroStar)',933],
[495,'建基',934],
[495,'金長城(GreatWall)',935],
[495,'康柏(Compaq)',936],
[495,'瑪思特',937],
[495,'美格(MAG)',938],
[495,'美齊',939],
[495,'夢想家(IMAGIC)',940],
[495,'明基(BenQ)',941],
[495,'納爾(NELL)',942],
[495,'普照(Maxview)',943],
[495,'三星(SAMSUNG)',944],
[495,'神州數位(Digitalchina)',945],
[495,'索尼(SONY)',946],
[495,'田浦(viva)',947],
[495,'微軟之星',948],
[495,'現代(HYUNDAI)',949],
[495,'雅美達',950],
[495,'藝卓(EIZO)',951],
[495,'易美遜(Envision)',952],
[495,'優派(ViewSonic)',953],
[495,'佐尼',954],

[368,'CD-RW燒錄機',496],

[496,'Acer',955],
[496,'LG',956],
[496,'MITSUMI',957],
[496,'愛國者',958],
[496,'昂達',959],
[496,'飛利浦',960],
[496,'聯想',961],
[496,'美達',962],
[496,'美格',963],
[496,'明基',964],
[496,'三星',965],
[496,'索尼',966],
[496,'台電',967],
[496,'微星',968],
[496,'優百特',969],

[368,'鍵盤',497],

[497,'飛利浦(Philips)',970],
[497,'NEC',971],
[497,'愛國者(Aigo)',972],
[497,'大水牛',973],
[497,'方正(founder)',974],
[497,'漢王',975],
[497,'黑貂',976],
[497,'技嘉(GIGABYTE)',977],
[497,'金翔',978],
[497,'康梭',979],
[497,'靈標',980],
[497,'羅技(Logitech)',981],
[497,'明基(BenQ)',982],
[497,'摩西',983],
[497,'人因',984],
[497,'三星(SAMSUNG)',985],
[497,'神州數位(Digitalchina)',986],
[497,'雙飛燕',987],
[497,'微軟(Microsoft)',988],
[497,'新貴科技',989],
[497,'優派(ViewSonic)',990],

[368,'耳機',498],

[498,'飛利浦(PHILIPS)',991],
[498,'創新(CREATIVE)',992],
[498,'歌美',993],
[498,'際通聯訊',994],
[498,'聯想(lenovo)',995],
[498,'羅技(Logitech)',996],
[498,'漫步者(Edifier)',997],
[498,'美狄斯(MDISI)',998],
[498,'三諾',999],
[498,'森海塞爾(SENNHEISER)',1000],
[498,'帥美',1001],
[498,'索尼(SONY)',1002],
[498,'鐵三角(Audio-technica)',1003],
[498,'新貴',1004],

[368,'散熱器',499],

[499,'AVC',1005],
[499,'OIC',1006],
[499,'Thermaltake',1007],
[499,'東遠(Syscooling)',1008],
[499,'富士康',1009],
[499,'紅辣椒',1010],
[499,'華碩(ASUS)',1011],
[499,'急凍王',1012],
[499,'技嘉(Giga-Byte)',1013],
[499,'勁冷(EVERCOOL)',1014],
[499,'九州風神',1015],
[499,'康梭',1016],
[499,'酷冷至尊(CoolerMaster)',1017],
[499,'散熱博士',1018],
[499,'泰碩',1019],
[499,'終結者',1020],

[368,'音箱',500],

[500,'飛利浦(PHILIPS)',1021],
[500,'NEC(NEC)',1022],
[500,'Thermaltake',1023],
[500,'愛國者(aigo)',1024],
[500,'傲森(Awesome)',1025],
[500,'奧特.藍星(Altec Lansing)',1026],
[500,'衝擊波',1027],
[500,'創新(CREATIVE)',1028],
[500,'大水牛',1029],
[500,'德國坦克',1030],
[500,'惠威(Hi-Vi RESEARCH)',1031],
[500,'金河田',1032],
[500,'蘭欣',1033],
[500,'朗勝',1034],
[500,'羅技(Logitech)',1035],
[500,'麥博(microlab)',1036],
[500,'漫步者',1037],
[500,'明基(BenQ)',1038],
[500,'納偉仕(NIVEOUS)',1039],
[500,'輕騎兵',1040],
[500,'三諾',1041],
[500,'三星',1042],
[500,'聲邁(XEMAL)',1043],
[500,'盈佳(EACAN)',1044],

[368,'MO磁光碟片機',501],

[501,'富士通',1045],
[501,'惠普(HP)',1046],
[501,'索尼(SONY)',1047],

[368,'遠端控制器',502],

[502,'Coolgate',1048],

[368,'滑鼠墊',503],

[503,'SteelPad',1049],
[503,'Thermaltake',1050],

[368,'轉接與數字線',504],

[504,'Thermaltake',1051],
[504,'百事靈',1052]
]
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
原文章及指令檔在http://blog.csdn.net/KimSoft/archive/2006/06/14/796430.aspx

實在不好意思，還沒找到這個部落格的引用在哪裡加！