首页 > 其他 > 详细

JQ实现省市联动

时间:2020-04-11 10:29:38      阅读:59      评论:0      收藏:0      [点我收藏+]
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>省市联动</title>
 6         <script type="text/javascript" src="../js/jquery-1.11.0.js"></script>
 7         <script>
 8             $(function(){
 9                 $("#province").change(function(){
10                     var cityArray = [["南京","苏州","无锡","常州"],["广州","深圳","东莞","惠州"],["杭州","宁波","温州","绍兴"]];
11                     var cities = cityArray[this.value];
12                     //清空select标签子元素方法一JS
13                     $("#city")[0].options.length=0;
14                     //清空select标签子元素方法二JQ
15                     $("#city").empty();
16                     $.each(cities, function(i,n) {
17                         $("#city").append("<option>" + n + "</option>");
18                     });
19                 });
20             });
21         </script>
22     </head>
23     <body>
24         <div>
25             <select id="province">
26                 <option value="-1">--请选择--</option>
27                 <option value="0">江苏省</option>
28                 <option value="1">广东省</option>
29                 <option value="2">浙江省</option>
30             </select>
31             <select id="city"></select>
32         </div>
33     </body>
34 </html>

 

JQ实现省市联动

原文:https://www.cnblogs.com/yxfyg/p/12677726.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!