javascript 联动菜单V1.0(简单二级菜单)

来源:互联网 发布:hybrid端口 编辑:程序博客网 时间:2024/05/21 22:56

HTML代码

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><select name="省" id ="pro" onchange="linkmenu();"></select><select name="市" id="city"></select><script type="text/javascript" src="test.js"></script></body></html>
javascript代码
var proName=["--请选择--","湖南","湖北"];var cityName=[["长沙","怀化"],["武汉","黄石"]];var proOptiion="";//初始化第一级菜单,省for(var i=-1;i<proName.length-1;i++){proOptiion+='<option value="' +i+ '">'+proName[i+1]+'</option>';}document.getElementById("pro").innerHTML=proOptiion;//第一级菜单改变时触发第二级菜单的函数function linkmenu(){cityOption=" ";var selectValue = document.getElementById("pro").value;var cityNumber=cityName[selectValue].length;for (var i = 0; i < cityNumber; i++){cityOption+='<option value="'+i+'">'+cityName[selectValue][i]+'</option>';}document.getElementById("city").innerHTML=cityOption;}



0 0
原创粉丝点击