<ptml> <pead> <meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "> <meta content=" amber [hopesoft],http://www.51ajaxcom "name=" author "> <title> Amber Net- JavaScript Unlimited level linkage menu </title> <style type= "Text/css" > Body, td {Font-family: XXFarEastFont-Arial; font-size:12px; } </style> <script language= "JavaScript" >/*-------------------------------------------------------- -------------------*\ | Subject:javascript level Three Linkage menu | | version:1.0 | | Author: Amber "Hopesoft" | | FileName:HPMenu.js | | created:2005-10-16 | | lastmodified:2005-10-16 | | Download: Http://www.10090.com/Demo/hpmenu/HPMenu.rar | | explain:http://www.10090.com/demo/| | demo:http://www.10090.com/demo/| | | | | |-----------------------------------------------------------------------------| | Msn:hopesoft at MSN.com http://www.51ajax.com/bbs/| | Copyright (c) 2004-2005 Hopesoftstudio | \*---------------------------------------------------------------------------*/function Menu (THEFORM,MENUID) {/* ---------------------------------------------------------------------------*\ * 1. Variable definition *//*---------------------------------------------------------------------------///define Menu level MENUCLass, menu length array menulenarr,//Menu name array menuarr, downlevel menu array submenuarr, menu ID array menuidarr var menuclass,menulenarr,menuarr, Submenuarr,menuidarr//Definition separator: splitchar1,splitchar2 var splitchar1,splitchar2//Define temporary array, sub array, array length, Var arr,subarr,a Rrlen/*---------------------------------------------------------------------------*\ * 2. Variable assignment * *//*---------------------------------------------------------------------------/Menuarr=new Arra Y () menulenarr=new array () submenuarr=new array () menuidarr=new array () menuarr[1]= "Europe | | | Asia | | | Africa | | | Oceania | | | North America | | | South America "//Continent name | | | ... menuarr[2]= "Europe # # # #德国 | | Europe # # #法国 | | | North America # # #美国 | | | North America # # #加拿大 | | | Asia # # #中国 | | | Africa # # #埃及 | | | Oceania # # #澳大利亚 | | | South America # # # #墨西哥 '//Zhou Name # # #国名 | | ... Menuarr[3]= "China # # # #北京 | | China # # # #上海 | | | USA # # #华盛顿 | | | USA # # #纽约 | | | Germany # # #柏林 | | | France # # #巴黎 | | | Canada # # #多伦多 | | | Egypt # # #开罗 | | | Australia # # #悉尼 | | | Mexico # # #墨西哥城 "//Country name # # #城市名 | | ... Menuarr[4]= "Beijing # # #朝阳区 | | | Shanghai # # #徐汇区 | | | Guangzhou # # #天河区 | | | New York # # #曼哈顿区 | | | Washington # # #华盛顿区 | | | Berlin # # #新柏林区 | | | Paris # # #大巴黎区 | | | Cairo# #大开罗 | | Sydney # # #悉尼市区 | | | MEXICO City # # # #墨西哥城区 '//Country name # # #城市名 | | ... Menuidarr[1]= "Zhou" menuidarr[2]= "Guo" menuidarr[3]= "shi" menuidarr[4]= "qu" menuclass=4//Level 4 menu splitchar1= "| | |"; Splitchar2= "###"; /*---------------------------------------------------------------------------*\ * 3. Generating arrays *//*---------------------------------------------------------------------------*/for (III=1;III<=MENUCLA ss;iii++) {arr=menuarr[iii].split (SPLITCHAR1); Len=arr.length; Subarr=new Array () for (i=0;i<len;i++) {subarr[i]=arr[i].split (SPLITCHAR2); } len=subarr.length; Submenuarr[iii]=subarr Menulenarr[iii]=len}//============ change downlevel menu ====================== var self,submenu,thislen , Thisarr//self This level menu//submenu submenu//theform: The Form Object [Type:object]//menuid: This level of menu level ID, such as Level 1 menu is 1 self=eval ("Doc Ument. " +theform.name+ "." +menuidarr[menuid] Submenu=eval ("document.") +theform.name+ "." +MENUIDARR[MENUID+1]) THISLEN=MENULENARR[MENUID+1] thisarr=submenuarr[menuid+1] submenu.length=0 submenu.options.add ( New option ("-----Please select-----", "")); for (i=0;i<thislen;i++) {if (thisarr[i][0] = = Self.value) {submenu.opt Ions.add (New Option (thisarr[i][1], thisarr[i][1]); } submenu.options[0].selected=true//============ Change the following menu ============== var kkk for (Kkk=menu id+2;kkk<=menuclass;kkk++) {submenu=eval ("document.") +theform.name+ "." +MENUIDARR[KKK]) submenu.length=0 submenu.options.add (new option ("-----Please select-----", "")); Submenu.options[0].selected=true} </script> <form name= "Form1" method= "Post" action= "" > <table width= "90%" border= "0" align= "center" cellpadding= "2" cellspacing= "1" bgcolor= "#CCCCCC" > <tr bgcolor= "f1f1f1" > <td height= "col"Span= "2" align= "center" > Amber infinite Level linkage menu-javascript version [Hpmenu v1.0]</td> </tr> <tr bgcol Or= "#FFFFFF" > <td width= "12%" height= "" align= "Center" > located in Chau:</td> <td> <select name= "Zhou" id= Zhou "onchange=" menu (this.form,1); " > <option value= "" selected>-----Please select-----</option> <option value= ' Europe ' > Europe </option> <option value= ' Asia ' > Asia </option> <option value= ' Africa ' > Africa </option> <option value= ' Oceania ' > Oceania </option> <option value= ' North America ' > North America </option> <option value= ' South America ' > South America </option> </select>< ;/td> </tr> <tr bgcolor= "#FFFFFF" > <td height= "align=" "Center" & gt; National:</td> <td><select name= "Guo" id= "select" OnchanGe= "menu (this.form,2);" > <option value= "" selected>-----Please select-----</option> </select></td> </tr> <tr bgcolor= "#FFFFFF" > <td height= "align=" "Center" > City: </td> <td><select name= "shi" id= "Select2" "onchange=" menu (this.form,3); " > <option value= "" selected>-----Please select-----</option> </select></td> </tr> <tr bgcolor= "#FFFFFF" > <td height= "align=" "Center" > Area: </td> <td><select name= "qu" id= "select3" > <option value= "" selected> -----Please select-----</option> </select></td> </tr> <tr bgcolor= " F1f1f1 "> <td height=" colspan= "2" align= "center" > </td> </tr> </table> <table width= "90%" border= "0" align= "center" cellpadding= "0" cellspacing= "0" > <TR&G T <TD height= "align=" "Left" > Download address: Please click here </td> </tr> <tr> < TD height= "Align=" "Left" > Online Demo: Please click here </td> </tr> <tr> <TD height= "align=" "left" >bug feedback: Please click here </td> </tr> <tr> <td H eight= "align=" "left" > contact:msn:hopesoft@msn.com</td> </tr> <tr> <TD height= "align=" "left" > </td> </tr> <tr> <t D height= "align=" "Center" >copyright (c) hopesoft Studio </td> </tr> </table > <script language= "javascript" > Menu (eval ("Document.form1"), 1) </ script&Gt </form> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]