<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>实现简单的省市连动</title>
</head>
<body>
<select id="pro" style="margin-left: 200px;" onchange="javascript:changeCity();">
</select>
<select id="city">
</select>
</body>
<script type="text/javascript">
var pro = document.getElementById("pro");
var city = document.getElementById("city");
var str = [['省份1', '1城市1', '1城市2', '1城市3', '1城市4', '1城市5', '1城市6', '1城市7', '1城市8']];
for(var i = 1; i <= 5; i++) {
var temp = [];
temp[0] = '省份' + (i+1);
for(j = 1; j < 9; j++) {
temp[j] = (i+1) + "城市" + j;
}
str[i] = temp;
}
load();
function load() {
for(var i = 0; i < str.length; i++) {
var oppro = new Option(str[i][0], i);
pro.options.add(oppro);
}
for (var j = 1; j < str[0].length; j++) {
var opcity = new Option(str[0][j], str[0][j]);
city.options.add(opcity);
}
}
function changeCity() {
city.options.length = 0; //清除option选项中的内容
//alert(pro.value);
for (var j = 1; j < str[pro.value].length; j++) {
var opcity = new Option(str[pro.value][j], i);
city.options.add(opcity);
}
}
</script>
</html>
JS数组——实现省市连动操作
最新推荐文章于 2021-01-30 01:59:54 发布