萬盛學電腦網 >> 腳本專題 >> javascript >> 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>雙選擇關聯菜單</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>javascript排行
程序編程推薦
相關文章
copyright © 萬盛學電腦網 all rights reserved