js下拉框二级关联菜单效果代码具体实现
这篇文章介绍了js下拉框二级关联菜单效果代码具体实现，有需要的朋友可以参考一下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312" /> <title>双选择关联菜单-www.jbxue.com</title> </head> <body> <form name="doublecombo"> <p> <select name="example" size="1" onChange="redirect(this.options.selectedIndex)"> <option>特效代码</option> <option>网页语言</option> <option>软件教程</option> </select> <select name="stage2" size="1"> <option value="/texiao/shubiao">鼠标类</option> <option value="/texiao/chuangkou">窗口类</option> <option value="/texiao/daohang">导航类</option> </select> <input type="button" name="test" value="Go!" onClick="go()"> </p> <script> <!-- var groups=document.doublecombo.example.options.length var group=new Array(groups) for (I=0; I<groups; I++) group[I]=new Array() group[0][0]=new Option("鼠标类","/texiao/shubiao") group[0][1]=new Option("窗口类","/texiao/chuangkou") group[0][2]=new Option("导航类","/texiao/daohang") group[1][0]=new Option("ASP","/yuyan/asp") group[1][1]=new Option("PHP","/yuyan/php") group[1][2]=new Option("JSP","/yuyan/jsp") group[2][0]=new Option("Dreamweaver","/ruanjian/Dreamweaver") group[2][1]=new Option("Fireworks","/ruanjian/Fireworks") group[2][2]=new Option("Flash","/ruanjian/Flash") group[2][3]=new Option("Photoshop","/ruanjian/Photoshop") var temp=document.doublecombo.stage2 function redirect(x){ for (m=temp.options.length-1;m>0;m--) temp.options[m]=null for (I=0;I<group[x].length;I++){ temp.options[I]=new Option(group[x][I].text,group[x][I].value) } temp.options[0].selected=true } function go(){ location=temp.options[temp.selectedIndex].value } //来源：脚本学堂 //--> </script> </form> </body> </html></td> </tr> </table>
