省市聯動——季度-月份下拉列表框——省市聯動類庫版
阿新 • • 發佈:2018-12-26
引入的jQuery類庫:
city.min.js;
jquery.cityselect.js;
jquery-1.6.1.js
原始碼:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title>省市聯動</title> <script type="text/javascript" src="js/jquery-1.6.1.js"></script> <script type="text/javascript" src="js/city.min.js"></script> <script type="text/javascript" src="js/jquery.cityselect.js"></script> <script type="text/javascript"> $(function(){ $("#city_5").citySelect({ url:{"citylist":[ {"p":"請選擇","c":[{"n":"請選擇月份"}]}, {"p":"第一季度","c":[{"n":"請選擇月份"},{"n":"1月"},{"n":"2月"},{"n":"3月"}]}, {"p":"第二季度","c":[{"n":"請選擇月份"},{"n":"4月"},{"n":"5月"},{"n":"6月"}]}, {"p":"第三季度","c":[{"n":"請選擇月份"},{"n":"7月"},{"n":"8月"},{"n":"9月"}]}, {"p":"第四季度","c":[{"n":"請選擇月份"},{"n":"10月"},{"n":"11月"},{"n":"12月"}]}, ]}, prov:"", city:"", dist:"", nodata:"none" }); }); </script> </head> <body> <h3>季度-月份下拉列表框</h3> <div id="city_5"> <select class="prov"></select> <select class="city" disabled="disabled"></select> <select class="dist" disabled="disabled"></select> </div> </body> </html>
顯示風格: