DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript綜合知識 >> js下拉框二級關聯菜單效果代碼
js下拉框二級關聯菜單效果代碼
編輯:JavaScript綜合知識     

 <!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>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved