js下拉框二級關聯菜單效果代碼具體實現
更新時間:2013年08月03日 10:35:10 作者:
這篇文章介紹了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>
相關文章
原生js操作checkbox用document.getElementById實現
js操作checkbox本人建議用document.getElementById(checkbox_id).checked不推薦使用jquery操作checkbox,感興趣的朋友不要錯過2013-10-10基于JS實現密碼框(password)中顯示文字提示功能代碼
這篇文章主要介紹了實現密碼框(password)中顯示文字提示功能代碼,在項目開發(fā)中經常會用到,需要的朋友可以參考下2016-05-05IE下通過a實現location.href 獲取referer的值
IE下采用window.location.href方式跳轉的話,referer值為空在標簽a里面的跳轉的話referer就不會空,下面是具體的實現代碼2014-09-09