?? 實例114.能夠鏈接的多級菜單.html
字號:
<div align="center">
<form name="form1">
<table border="0" cellspacing="0" cellpadding="0">
<tr align="center">
<td nowrap height="11">
<select name="example" size="1" onChange="redirect(this.options.selectedIndex)">
<option selected>我的辦公室</option>
<option>個人事務</option>
<option>辦公助理</option>
</select>
<select name="stage2" size="1" onChange="redirect1(this.options.selectedIndex)">
<option value=" " selected>今日辦公</option>
<option value=" ">公共信息</option>
<option value=" ">部門信息</option>
</select>
<select name="stage3" size="1" onChange="redirect2(this.options.selectedIndex)">
<option value=" " selected>任務</option>
<option value=" ">日志</option>
<option value=" ">提醒</option>
</select></table>
</form></div>
<script language="JavaScript">
<!--
var groups=document.form1.example.options.length // 一級菜單的長度
var group=new Array(groups) // 定義數組
for (i=0; i<groups; i++) // 循環
group[i]=new Array()
group[0][0]=new Option("今日辦公"," "); // 二級菜單項目
group[0][1]=new Option("公共信息"," ");
group[0][2]=new Option("部門信息"," ");
group[1][0]=new Option("電子郵件"," ");
group[1][1]=new Option("通訊錄","");
group[1][2]=new Option("公文包","");
group[1][3]=new Option("電子賀卡","");
group[2][0]=new Option("郵政編碼"," ");
group[2][1]=new Option("列車時刻","");
group[2][2]=new Option("世界時間","");
var temp=document.form1.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
redirect1(0) // 指向三級菜單
}
var secondGroups=document.form1.stage2.options.length // 獲取二級菜單的長度
var secondGroup=new Array(groups) // 定義數組
for (i=0; i<groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j<group[i].length; j++) {
secondGroup[i][j]=new Array() }}
secondGroup[0][0][0]=new Option("任務","http://www.sina.com.cn"); // 三級菜單項目
secondGroup[0][0][1]=new Option("日志","http://www.sina.com.cn");
secondGroup[0][0][2]=new Option("提醒","http://www.sina.com.cn");
secondGroup[0][1][0]=new Option("添加","http://www.sina.com.cn");
secondGroup[0][1][1]=new Option("修改","http://www.sina.com.cn");
secondGroup[0][1][2]=new Option("刪除","http://www.sina.com.cn");
secondGroup[0][2][0]=new Option("添加部門","http://www.sina.com.cn");
secondGroup[0][2][1]=new Option("添加用戶","http://www.sina.com.cn");
secondGroup[0][2][2]=new Option("添加信息","http://www.sina.com.cn");
secondGroup[1][0][0]=new Option("添加郵件","http://www.sina.com.cn");
secondGroup[1][0][1]=new Option("修改郵件","http://www.sina.com.cn");
secondGroup[1][0][2]=new Option("刪除郵件","http://www.sina.com.cn");
secondGroup[1][1][0]=new Option("添加通訊錄","http://www.sina.com.cn");
secondGroup[1][1][1]=new Option("修改通訊錄","http://www.sina.com.cn");
secondGroup[1][1][2]=new Option("刪除通訊錄","http://www.sina.com.cn");
secondGroup[1][2][0]=new Option("添加公文包","http://www.sina.com.cn");
secondGroup[1][2][1]=new Option("修改公文包","http://www.sina.com.cn");
secondGroup[1][2][2]=new Option("刪除公文包","http://www.sina.com.cn");
secondGroup[1][3][0]=new Option("添加賀卡","http://www.sina.com.cn");
secondGroup[1][3][1]=new Option("修改賀卡","http://www.sina.com.cn");
secondGroup[1][3][2]=new Option("刪除賀卡","http://www.sina.com.cn");
secondGroup[2][0][0]=new Option("添加郵政編碼","http://www.sina.com.cn");
secondGroup[2][0][1]=new Option("修改郵政編碼","http://www.163.com");
secondGroup[2][0][2]=new Option("刪除郵政編碼","http://www.sohu.com");
secondGroup[2][1][0]=new Option("添加列車時刻","http://www.baidu.com");
secondGroup[2][1][1]=new Option("修改列車時刻","http://www.google.com");
secondGroup[2][1][2]=new Option("刪除列車時刻","http://www.chinaren.com");
secondGroup[2][2][0]=new Option("添加世界時間","http://www.newhua.com");
secondGroup[2][2][1]=new Option("修改世界時間","http://www.yahoo.com.cn");
secondGroup[2][2][2]=new Option("刪除世界時間","http://www.china.com");
var temp1=document.form1.stage3
function redirect2(){
window.open(temp1.value,"","toolbar=no,location=yes,directories=no,status=no,menubar=no,scrollbars=yes, resizable=yes,copyhistory=yes,width=700,height=450");
}
function redirect1(y){
for (m=temp1.options.length-1;m>0;m--)
temp1.options[m]=null
for (i=0;i<secondGroup[document.form1.example.options.selectedIndex][y].length;i++){ // 進行三級菜單內容循環
temp1.options[i]=new Option(secondGroup[document.form1.example.options.selectedIndex][y][i].text,secondGroup[document.form1.example.options.selectedIndex][y][i].value)
// 顯示三級菜單項目
}
temp1.options[0].selected=true
}
//-->
</script>
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -