二级连动菜单

二级连动菜单 源代码如下：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE&am

crabdave

134人浏览 · 2008-12-22 14:00:16

crabdave · 2008-12-22 14:00:16 发布

二级连动菜单

源代码如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript">
//准备一级菜单数据
var delType=new Array();
    delType[0]=new Array();
delType[0].push("一级选项A");
delType[0].push("A1");
delType[1]=new Array();
delType[1].push("一级选项B");
delType[1].push("B1");
//准备二级菜单数据
var delReas=new Array();
    delReas[0]=new Array();
delReas[0].push("二级选项A");
delReas[0].push("A2");
delReas[0].push("A1");
    delReas[1]=new Array();
delReas[1].push("二级选项B");
delReas[1].push("B2");
delReas[1].push("A1");
delReas[2]=new Array();
delReas[2].push("二级选项C");
delReas[2].push("C2");
delReas[2].push("B1");
</script>
</HEAD>
<BODY>
<select id="firstSel" οnchange="selSecondSel(this)">
</select>

<select id="secondSel">
</select>
<script language="javascript">
//初始化一级菜单
    var sel_Obj_f=document.getElementById("firstSel");

for(var i=0;i<delType.length;i++){
    var oOption = document.createElement("OPTION");
  sel_Obj_f.options.add(oOption);
  oOption.innerText = delType[i][0];
  oOption.value = delType[i][1];
  if(i==0){
  oOption.selected = "true";
  }
}
//初始化二级菜单
selSecondSel(sel_Obj_f);
function selSecondSel(firstSel){
//取出一级菜单选择的是哪一个
   var sel_Index = firstSel.selectedIndex;
var temp=firstSel.options[sel_Index].value;

//设置二级菜单
var sel_Obj_s=document.getElementById("secondSel");
sel_Obj_s.innerHTML="";
//alert(delReas.length);
for(var i=0;i<delReas.length;i++){
   if(delReas[i][2]==temp){
    var oOption = document.createElement("OPTION");
  sel_Obj_s.options.add(oOption);
  oOption.innerText = delReas[i][0];;
  oOption.value = delReas[i][1];
  }
}
}
</script>
</BODY>
</HTML>

AtomGit 开源协作平台测评赛

瓜分20万奖金获得内推名额丰厚实物奖励易参与易上手

更多推荐

【Spring Boot 】Spring Boot + HikariCP 连接池使用示例

文章目录示例工具版本HikariCP 依赖HikariCP 配置1. connectionTimeout2. minimumIdle3. maximumPoolSize4. idleTimeout5. maxLifetime6. autoCommitSpring Boot Data + HikariCP + MySQL示例测试应用程序1. 使用 Maven 命令2. 使用 Eclipse3. 使用