abstract:<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>省市区三级联动</title> </head><body>省:<selec
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>省市区三级联动</title>
</head>
<body>
省:<select name="" id="pro"> </select>
市:<select name="" id="city"></select>
区县:<select name="" id="area"></select>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script>
$(function() {
$.getJSON("1.json",function (data) {
let option='<option value="">选择(省)</option>';
$.each(data, function(i){
option += '<option value="' + data[i].proId + '">'+ data[i].proName + '</option>';
})
$('#pro').html(option);
})
})
$('#pro').change(function(){
console.log($(this).find('.selected').text());
$.getJSON("2.json",function (data) {
let option='<option value="">选择(市)</option>';
$.each(data, function(i){
if(data[i].proId==$('#pro').val()){
option += '<option value="' + data[i].cityId + '">'+ data[i].cityName + '</option>';
}
})
$('#pro').html(option);
})
})
$('#city').change(function(){
console.log($(this).find('.selected').text());
$.getJSON("3.json",function (data) {
let option='<option value="">选择(区县:)</option>';
$.each(data, function(i){
if(data[i].cityId==$('#city').val()){
option += '<option value="' + data[i].areaId + '">'+ data[i].areaName + '</option>';
}
})
$('#area').html(option);
})
})
</script>
</body>
</html>
Correcting teacher:天蓬老师Correction time:2018-12-16 16:32:36
Teacher's summary:作业完成的不错,最好能付上运行结果的截图。