jquery实现一个简单的select二级联动菜单，代码如下
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>jQuery 二级联动</title>
6 <style>
7 .city{
8 display: none;;
9 }
10 .city_first {
11 display: block;
12 }
13 </style>
14 <script src="jquery/jquery-1.11.3.min.js"></script>
15 <script>
16 $(document).ready(function(){
17 $("#province").change(function(){
18 var index = $(this).get(0).selectedIndex;
19 $(‘.city‘).hide().eq(index).show();
20 });
21 });
22 </script>
23 </head>
24 <body>
25 <select id="province">
26 <option>----请选择省份----</option>
27 <option>北京</option>
28 <option>上海</option>
29 <option>江苏</option>
30 </select>
31 <select class="city city_first">
32 <option>----请选择城市----</option>
33 </select>
34
35 <select class="city">
36 <option>----请选择城市----</option>
37 <option>东城</option>
38 <option>西城</option>
39 <option>崇文</option>
40 <option>宣武</option>
41 <option>朝阳</option>
42 </select>
43 <select class="city">
44 <option>----请选择城市----</option>
45 <option>黄浦</option>
46 <option>卢湾</option>
47 <option>徐汇</option>
48 <option>长宁</option>
49 <option>静安</option>
50 </select>
51 <select class="city">
52 <option>----请选择城市----</option>
53 <option>南京</option>
54 <option>镇江</option>
55 <option>苏州</option>
56 <option>南通</option>
57 <option>扬州</option>
58 </select>
59 </body>
60 </html>
时间： 2024-11-05 21:43:33