<select name="province" id="province" onchange="getCity()">
<option value="0">所在省</option>
<option value="直辖市">直辖市</option>
<option value="广东省">广东省</option>
<option value="江苏省">江苏省</option>
<option value="福建省">福建省</option>
</select>
<select name="city" id="city" onchange="getDistrict()">
<option value="0">所在市</option>
</select>
<select class="clear-Mar" name="district" id="district">
<option value="0">所在区</option>
</select>
<script>
var city = [["北京市", "天津市", "上海市", "重庆市"], ["广州市", "深圳市", "珠海市", "东莞市"], ["南京市", "苏州市", "南通市", "常州市"], ["福州市", "厦门市", "莆田市", "泉州市"]];
var district = [[["东城区", "西城区", "宣武区"], ["和平区", "红桥区", "塘沽区"], ["杨浦区", "徐汇区"], ["万州区", "涪陵区"]], [["天河区", "海珠区", "白云区", "番禺区"], ["南山区", "宝安区", "福田区"], ["香洲区", "斗门区", "金湾区"], ["东城区", "莞城区", "万江区"]], [['玄武区', '白下区', '秦淮区', '建邺区'], ['沧浪区', '平江区', '金阊区', '虎丘区'], ['崇川区', '港闸区', '海安县', '如东县'], ['天宁区', '钟楼区', '新北区']], [['鼓楼区', '台江区', '仓山区', '马尾区'], ['思明区', '海沧区', '湖里区', '集美区'], ['城厢区', '涵江区', '荔城区', '秀屿区'], ['鲤城区', '丰泽区', '洛江区', '泉港区']]];
function getCity() {
//获得省份下拉框的对象
// var sltProvince=document.forms[0].province;
var sltProvince = document.getElementById("province");
//获得城市下拉框的对象
//var sltCity=document.forms[0].city;
var sltCity = document.getElementById("city");
//获得市区下拉框的对象
// var sltDistrict=document.forms[0].district;
var sltDistrict = document.getElementById("district");
//得到对应省份的城市数组
var provinceCity = city[sltProvince.selectedIndex - 1];
//清空城市下拉框,仅留提示选项
sltCity.length = 1;
sltDistrict.length = 1;
//将城市数组中的值填充到城市下拉框中
for (var i = 0; i < provinceCity.length; i++) {
sltCity[i + 1] = new Option(provinceCity[i],provinceCity[i]);
}
}
function getDistrict() {
var sltProvince = document.getElementById("province");
//获得城市下拉框的对象
var sltCity = document.getElementById("city");
//获得市区下拉框的对象
var sltDistrict = document.getElementById("district");
//得到对应城市的市区数组
var cityDistrict = district[sltProvince.selectedIndex - 1][sltCity.selectedIndex - 1];
//清空城市下拉框,仅留提示选项
sltDistrict.length = 1;
//将市区数组中的值填充到市区下拉框中
for (var i = 0; i < cityDistrict.length; i++) {
sltDistrict[i + 1] = new Option(cityDistrict[i],cityDistrict[i]);
}
}
</script>
js省市区下拉代码分享
猜你喜欢
转载自blog.csdn.net/river131/article/details/77851174
今日推荐
周排行