<html>
<head>
<meta charset="utf-8">
<title>jQuery 二级联动</title>
<style>
.city{
display: none;;
}
.city_first {
display: block;
}
</style>
<script src="../css/jquery-1.12.4.js"></script>
<script>
$(document).ready(function(){
$("#province").change(function(){
var i = $(this).get(0).selectedIndex;
$('.city').hide().eq(i).show();
});
});
</script>
</head>
<body>
<select id="province">
<option>----请选择省份----</option>
<option>北京</option>
<option>上海</option>
<option>江苏</option>
</select>
<select class="city city_first">
<option>----请选择城市----</option>
</select>
<select class="city">
<option>----请选择城市----</option>
<option>东城</option>
<option>西城</option>
<option>崇文</option>
<option>宣武</option>
<option>朝阳</option>
</select>
<select class="city">
<option>----请选择城市----</option>
<option>黄浦</option>
<option>卢湾</option>
<option>徐汇</option>
<option>长宁</option>
<option>静安</option>
</select>
<select class="city">
<option>----请选择城市----</option>
<option>南京</option>
<option>镇江</option>
<option>苏州</option>
<option>南通</option>
<option>扬州</option>
</select>
</body>
</html>02（2）jQuery二级联动
猜你喜欢
转载自blog.csdn.net/qq_41586597/article/details/84994469
今日推荐
周排行