同步到csdn,掘金才是大神,csdn要收费,我直接发免费。哈哈哈! 开头说明真的很重要,不然就没人看了,加油程序员,你是最棒的,我才是代码的主宰,代码修理bug,bug已修复。
省市联动
废话不多说,上代码 --罗
我的csdn
blog.csdn.net/iamyoudad/a…
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<select name="sheng">
<option value="0">请选择</option>
</select>
<select name="shi">
<option value="0">请选择</option>
</select>
<select name="qu">
<option value="0">请选择</option>
</select>
</body>
<script>
var shengEle = document.getElementsByName('sheng')[0];
var shiEle = document.getElementsByName('shi')[0];
var quEle = document.getElementsByName('qu')[0];
var shengArr = ['广东', '四川', '新疆'];
var shiArr = [['揭阳', '梅州'], ['成都', '攀枝花市'], ['乌鲁木齐', '新疆市区']];
var quArr = [[['普宁', '梅园']], [['成都小区', '攀枝花小区']], [['乌鲁木齐小区', '新疆小区']]];
shengshi(shengArr, shengEle)
function shengshi(arr, ele) {
arr.forEach(function (a, b) {
var obj = new Option(a, b)
ele.appendChild(obj)
})
}
shengEle.onchange = function () {
shiEle.innerHTML = `<option value="0">请选择</option>`
quEle.innerHTML = `<option value="0">请选择</option>`
shengshi(shiArr[this.value],shiEle)
}
shiEle.onchange = function(){
shengshi(quArr[shengEle.value][this.value],quEle)
}
</script>
</html>