您的位置：首页 > Web前端 > JavaScript

javascript实现的省市县级联菜单

2013-03-26 15:02 344 查看
<script type="text/javascript">

var array = new Array();

array['黑龙江']=['哈尔滨市','齐齐哈尔市','鸡西市','鹤岗市'];

array['陕西']=['西安','咸阳','渭南','汉中'];

array['山东']=['济南','青岛','威海','日照'];

array['黑龙江']['哈尔滨市']=['道里区','南岗区','道外区','平房区'];

array['黑龙江']['齐齐哈尔市']=['龙沙区','建华区','铁锋区','昂昂溪区'];

array['黑龙江']['鸡西市']=['鸡冠区','恒山区','滴道区','梨树区'];

array['黑龙江']['鹤岗市']=['向阳区','工农区','南山区','兴安区'];

array['陕西']['西安']=['新城区','碑林区','莲湖区','灞桥区'];

array['陕西']['咸阳']=['三原县','礼泉县','彬县','长武县'];

array['陕西']['渭南']=['临渭区','华县','合阳县','白水县'];

array['陕西']['汉中']=['汉台区','南郑县','洋县','西乡县'];

array['山东']['济南']=['历下区','市中区','天桥区','历城区'];

array['山东']['青岛']=['市南区','市北区','四方区','黄岛区'];

array['山东']['威海']=['环翠区','文登市','荣成市','乳山市'];

array['山东']['日照']=['东港区','岚山区','五莲县'];

function displayShi(){

var sheng = document.getElementById("sheng").value;

var o_shi = document.getElementById("shi").options;

var o_xian = document.getElementById("xian").options;

o_shi.length=0;

o_xian.length=0;

for(i=0;i<array[sheng].length;i++){

o_shi.add(new Option(array[sheng][i],array[sheng][i]));

}

var first_shi = array[sheng][0];

for(i=0;i<array[sheng][first_shi].length;i++){ //注意这里不能写成array[sheng][0].length

o_xian.add(new Option(array[sheng][first_shi][i],array[sheng][first_shi][i]));

}

}

function displayXian(){

var sheng = document.getElementById("sheng").value;

var shi = document.getElementById("shi").value;

var o_xian = document.getElementById("xian").options;

o_xian.length=0;

for(i=0;i<array[sheng][shi].length;i++){

o_xian.add(new Option(array[sheng][shi][i],array[sheng][shi][i]));

}

}

</script>

</head>

<body>

<select name="sheng" id="sheng" onchange="displayShi()">

<option value="">--请选择--</option>

<option value="黑龙江">黑龙江</option>

<option value="陕西">陕西</option>

<option value="山东">山东</option>

</select>

<select name="shi" id="shi" onchange="displayXian()">

<option value="">--请选择--</option>

</select>

<select name="xian" id="xian">

<option value="">--请选择--</option>

</select>

<input type="button" value="点我" onclick="test()" />

</body>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航