function pp() {
var s = document.getElementById("s2").value
var ah = new Array("安庆", "蚌埠", "巢湖", "池州", "滁州", "阜阳", "合肥", "淮北", "淮南", "黄山", "六安", "马鞍山", "宿州", "铜陵", "芜湖", "宣城", "亳州")
var js = new Array("常州", "淮安", "连云港", "南京", "南通", "苏州", "宿迁", "泰州", "无锡", "徐州", "盐城", "扬州", "镇江")
var sc = new Array("阿坝", "巴中", "成都", "达州", "德阳", "甘孜", "广安", "广元", "乐山", "凉山", "眉山", "绵阳", "南充", "内江", "攀枝花", "遂宁", "雅安", "宜宾", "资阳", "自贡", "泸州")
if (s == "0") {
for (var i = 0i <ah.lengthi++) {
document.getElementById("s3").options[i] = new Option(ah[i] + 1 + "日")
}
}
}
</script>
<div class="address">
<span>地址:</span>
<select id="s1">
<option>中国</option>
</select>
<select id="s2" onchange="javascript:pp()">
<option value="">省份、州</option>
<option value="0">安徽</option>
<option value="1">江苏</option>
<option value="2">四川</option>
</select>
<select id="s3">
<option>市、县</option>
</select>
</div>
源码里面要记得放省事等数据 要json的格式<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>省市区三级联动</title>
</head>
<body>
<form>
<select id="province">
<option>请选择省份</option>
</select>
<select id="city">
<option>请选择城市</option>
</select>
<select id="district">
<option>请选择区域</option>
</select>
</form>
<script src="json.js"></script>
<script type="text/javascript">
var proData = [],
cityData = [],
distData = []
var proSelect = document.getElementById("province"),
citySelect = document.getElementById("city"),
districtSelect = document.getElementById("district")
var curPro = "",
curCity = ""
// 封装更新选择列表函数
function fillselect(select,list){
for (var i = select.length-1i >0 i--){
select.remove(i)
}
list.forEach(function(data){
var option = new Option(data.name, data.sheng)
option.dataset.di = data.di
select.add(option)
})
}
// 将数据按省、市、地区分别存储
dataJson.forEach(function(data){
if (data.level === 1){
proData.push(data)
}
if (data.level === 2){
cityData.push(data)
}
if (data.level === 3){
distData.push(data)
}
})
fillselect(proSelect,proData)
// 监听一级省份选择列表change事件,更新二级城市列表
proSelect.addEventListener("change",function(event){
var val = event.target.value
var list = []
cityData.forEach(function(d){
if (d.sheng === val) {
list.push(d)
}
})
fillselect(citySelect,list)
})
// 监听二级城市选择列表change事件,更新三级区域列表
citySelect.addEventListener("change",function(event){
var val = event.target.value
var curIndex = event.target.selectedIndex
curCity = event.target[curIndex].dataset.di
console.log(event.target,curCity)
var list = []
distData.forEach(function(d){
if (d.di === curCity &&d.sheng === val) {
list.push(d)
}
})
fillselect(districtSelect,list)
})
</script>
</body>
</html>
页面中获取值并判断的js如下:<script type="text/javascript">
//这个函数是必须的,因为在area.js里每次更改地址时会调用此函数
function promptinfo()
{
var address = document.getElementById('address')
var s1 = document.getElementById('s1')
var s2 = document.getElementById('s2')
var town1 = document.getElementById('town1')