abstrakt：總結(jié)：寫代碼，是需要細(xì)心和努力的。加油，代碼：html：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>三級聯(lián)動菜單</title></head><body>省 <selec
總結(jié)：
寫代碼，是需要細(xì)心和努力的。加油，
代碼：
html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>三級聯(lián)動菜單</title>
</head>
<body>
省 <select name="" id="pro"></select>
市 <select name="" id="city"></select>
區(qū) <select name="" id="area"></select> <br>
<span id="proaddr"></span>
<span id="cityaddr"></span>
<span id="areaaddr"></span>
<script src="jq.js"></script>
<script>
$(function(){
$.getJSON(
'inc/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);
}
);
let addr = "";
$('#pro').change(function(){
//查看當(dāng)前選中的元素內(nèi)容
console.log($(this).find(':selected').text());
addr = $(this).find(':selected').text();
$('#proaddr').html(addr);
$.getJSON('inc/2.json', function(data){
let option = '<option>選擇(市)</option>';
$.each(data, function(i){
if(data[i].proId == $('#pro').val()){
option += '<option value="'+ data[i].cityId +'">'+ data[i].cityName +'</option>';
}
});
$('#city').html(option);
});
});
$('#city').change(function(){
addr = $(this).find(':selected').text();
$('#cityaddr').html(addr);
$.getJSON('inc/3.json', function(data){
let option = '<option>選擇(區(qū)/縣)</option>';
$.each(data, function(i){
if(data[i].cityId == $('#city').val())
option += '<option value="' + data[i].areaId + '">' + data[i].areaName + '</option>';
});
$('#area').html(option);
});
});
$('#area').change(function(){
addr = $(this).find(':selected').text();
$('#areaaddr').html(addr);
})
})
</script>
</body>
</html>
json:
1
[
{
"proId": 1,
"proName": "河南"
},
{
"proId": 2,
"proName": "四川"
}
]
2
[
{
"cityId" : 1,
"cityName" : "洛陽",
"proId" : 1
},
{
"cityId" : 2,
"cityName" : "鄭州",
"proId" : 1
},
{
"cityId" : 3,
"cityName" : "成都",
"proId" : 2
},
{
"cityId" : 4,
"cityName" : "巴中",
"proId" : 2
}
]
[
{
"areaId" : 1,
"areaName" : "新安縣",
"cityId" : 1
},
{
"areaId" : 2,
"areaName" : "澗西區(qū)",
"cityId" : 1
},
{
"areaId" : 3,
"areaName" : "金水區(qū)",
"cityId" : 2
},
{
"areaId" : 4,
"areaName" : "二七區(qū)",
"cityId" : 2
},
{
"areaId" : 5,
"areaName" : "都江堰",
"cityId" : 3
},
{
"areaId" : 6,
"areaName" : "金牛區(qū)",
"cityId" : 3
},
{
"areaId" : 7,
"areaName" : "巴州區(qū)",
"cityId" : 4
},
{
"areaId" : 8,
"areaName" : "平昌縣",
"cityId" : 4
}
]
Korrigierender Lehrer：查無此人Korrekturzeit：2019-04-16 09:38:25
Zusammenfassung des Lehrers：說的不錯，作業(yè)完成的很好。就是代碼有點亂，養(yǎng)成好習(xí)慣，整理下代碼。繼續(xù)加油。