javascript三級聯動菜單
<html> <head> <title>級聯菜單</title> <meta http-equiv="Content-Type" content="text/html; charset=utf8"> <script language="JavaScript"> function Dsy() { this.Items = {}; } Dsy.prototype.add = function(id,iArray) { this.Items[id] = iArray; } Dsy.prototype.Exists = function(id) { if(typeof(this.Items[id]) == "undefined") { return false; } return true; } function change(v) { var str="0"; for(i=0;i<v;i++) { str+=("_"+(document.getElementById(s[i]).selectedIndex-1)); }; var ss=document.getElementById(s[v]); with(ss) { length = 0; options[0]=new Option(opt0[v],opt0[v]); if(v && document.getElementById(s[v-1]).selectedIndex>0 || !v) { if(dsy.Exists(str)) { ar = dsy.Items[str]; for(i=0;i<ar.length;i++) { options[length]=new Option(ar[i],ar[i]); } if(v)options[1].selected = true; } } if(++v<s.length) { change(v); } } } var dsy = new Dsy(); dsy.add("0",["總辦","財政部","技術部"]); dsy.add("0_0",["技術總辦","銷售總辦","人事總辦"]); dsy.add("0_0_0",["1"]); dsy.add("0_0_1",["2"]); dsy.add("0_0_2",["3"]); dsy.add("0_1",["財政一","財政二","財政三"]); dsy.add("0_1_0",["1"]); dsy.add("0_1_1",["1","2"]); dsy.add("0_1_2",["1","2"]); dsy.add("0_2",["eoms","sp","網管綜合","技術支撐"]); dsy.add("0_2_0",["1","2","3"]); dsy.add("0_2_1",["1","3","2"]); dsy.add("0_2_2",["1","3","2"]); dsy.add("0_2_3",["1","3","2"]); </script> <script language = JavaScript> var s=["s1","s2","s3"]; var opt0 = ["部門","組","人員"]; function setup() { for(i=0;i<s.length-1;i++) document.getElementById(s[i]).onchange=new Function("change("+(i+1)+")"); change(0); } </script> </head> <body onLoad="setup()" > <form name="frm"> <select id="s1"> </select> <select id="s2"> </select> <select id="s3"> </select> </form> </body> </html>