jquery省份二級選單聯動
阿新 • • 發佈：2018-12-18
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE"> <title>二級聯動</title> <script src="public/js/jquery1.42.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ //觸發select的改變事件 $("#province").change(function(){ //遍歷#province下的option $("#province option").each(function(i,o){ //設定選中功能 if($(this).attr("selected")) { $(".city").hide(); $(".city").eq(i).show(); } }); }); $("#province").change(); }); </script> </head> <body> <select id="province"> <option>----請選擇省份----</option> <option>北京</option> <option>上海</option> <option>江蘇</option> </select> <select class="city"> <option>----請選擇城市----</option> </select> <select class="city"> <option>東城</option> <option>西城</option> <option>崇文</option> <option>宣武</option> <option>朝陽</option> </select> <select class="city"> <option>黃浦</option> <option>盧灣</option> <option>徐匯</option> <option>長寧</option> <option>靜安</option> </select> <select class="city"> <option>南京</option> <option>鎮江</option> <option>蘇州</option> <option>南通</option> <option>揚州</option> </select> </body> </html>