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实现省市联动
猜你喜欢
转载自www.cnblogs.com/yxfyg/p/12677726.html
今日推荐
周排行