省市選擇器

gaara 發布于2019-08-19 18:26 / 3308人閱讀

摘要：說明根據選擇的省名，自動調用數據庫中的記錄，在指定的元素中填充相應的城市名。

說明：根據選擇的省名，自動調用數據庫中的記錄，在指定的select元素中填充相應的城市名。城市數據庫也一并附上。


  所在地區
  
  城市

var address={"上海":["上海市"],"江蘇":["南京市", "無錫市", "徐州市", "常州市", "蘇州市", "南通市", "連云港市", "淮安市", "鹽城市", "揚州市", "鎮江市", "泰州市", "宿遷市"],"浙江":["杭州市", "寧波市", "溫州市", "嘉興市", "湖州市", "紹興市", "金華市", "衢州市", "舟山市", "臺州市", "麗水市"],"安徽":["合肥市", "蕪湖市", "蚌埠市", "淮南市", "馬鞍山市", "淮北市", "銅陵市", "安慶市", "黃山市", "滁州市", "阜陽市", "宿州市", "巢湖市", "六安市", "亳州市", "池州市", "宣城市"],"福建":["福州市", "廈門市", "莆田市", "三明市", "泉州市", "漳州市", "南平市", "龍巖市", "寧德市"],"北京":["北京市"],"天津":["天津市"],"廣東":["廣州市", "韶關市", "深圳市", "珠海市", "汕頭市", "佛山市", "江門市", "湛江市", "茂名市", "肇慶市", "惠州市", "梅州市", "汕尾市", "河源市", "陽江市", "清遠市", "東莞市", "中山市", "潮州市", "揭陽市", "云浮市"],"廣西":["南寧市", "柳州市", "桂林市", "梧州市", "北海市", "防城港市", "欽州市", "貴港市", "玉林市", "百色市", "賀州市", "河池市", "來賓市", "崇左市"],"云南":["昆明市", "曲靖市", "玉溪市", "保山市", "昭通市", "麗江市", "思茅市", "臨滄市", "楚雄彝族自治州", "紅河哈尼族彝族自治州", "文山壯族苗族自治州", "西雙版納傣族自治州", "大理白族自治州", "德宏傣族景頗族自治州", "怒江傈僳族自治州", "迪慶藏族自治州"],"貴州":["貴陽市", "六盤水市", "遵義市", "安順市", "銅仁地區", "畢節地區", "黔西南布依族苗族自治州", "黔東南苗族侗族自治州", "黔南布依族苗族自治州"],"四川":["成都市", "自貢市", "攀枝花市", "瀘州市", "德陽市", "綿陽市", "廣元市", "遂寧市", "內江市", "樂山市", "南充市", "眉山市", "宜賓市", "廣安市", "達州市", "雅安市", "巴中市", "資陽市", "阿壩藏族羌族自治州", "甘孜藏族自治州", "涼山彝族自治州"],"內蒙古":["呼和浩特市", "包頭市", "烏海市", "赤峰市", "通遼市", "鄂爾多斯市", "呼倫貝爾市", "巴彥淖爾市", "烏蘭察布市", "興安盟", "錫林郭勒盟", "阿拉善盟"],"寧夏":["銀川市", "石嘴山市", "吳忠市", "固原市", "中衛市"],"甘肅":["蘭州市", "嘉峪關市", "金昌市", "白銀市", "天水市", "武威市", "張掖市", "平涼市", "酒泉市", "慶陽市", "定西市", "隴南市", "臨夏回族自治州", "甘南藏族自治州"],"重慶":["重慶市"],"江西":["南昌市", "景德鎮市", "萍鄉市", "九江市", "新余市", "鷹潭市", "贛州市", "吉安市", "宜春市", "撫州市", "上饒市"],"黑龍江":["哈爾濱市", "齊齊哈爾市", "雞西市", "鶴崗市", "雙鴨山市", "大慶市", "伊春市", "佳木斯市", "七臺河市", "牡丹江市", "黑河市", "綏化市", "大興安嶺地區"],"吉林":["長春市", "吉林市", "四平市", "遼源市", "通化市", "白山市", "松原市", "白城市", "延邊朝鮮族自治州"],"遼寧":["沈陽市", "大連市", "鞍山市", "撫順市", "本溪市", "丹東市", "錦州市", "營口市", "阜新市", "遼陽市", "", "盤錦市", "鐵嶺市", "朝陽市", "葫蘆島市"],"山東":["濟南市", "青島市", "淄博市", "棗莊市", "東營市", "煙臺市", "濰坊市", "", "濟寧市", "泰安市", "威海市", "日照市", "萊蕪市", "臨沂市", "德州市", "聊城市", "濱州市", "菏澤市"],"山西":["太原市", "大同市", "陽泉市", "長治市", "晉城市", "朔州市", "晉中市", "運城市", "忻州市", "臨汾市", "呂梁市"],"陜西":["西安市", "銅川市", "寶雞市", "咸陽市", "渭南市", "延安市", "漢中市", "榆林市", "安康市", "商洛市"],"河北":["石家莊市", "唐山市", "秦皇島市", "邯鄲市", "邢臺市", "保定市", "張家口市", "承德市", "滄州市", "廊坊市", "衡水市"],"河南":["鄭州市", "開封市", "洛陽市", "平頂山市", "安陽市", "鶴壁市", "新鄉市", "焦作市", "濟源市", "濮陽市許昌市", "漯河市", "三門峽市", "南陽市", "商丘市", "信陽市", "周口市", "駐馬店市"],"湖北":["武漢市", "黃石市", "十堰市", "宜昌市", "襄樊市", "鄂州市", "荊門市", "孝感市", "荊州市", "黃岡市", "", "咸寧市", "隨州市", "恩施土家族苗族自治州", "仙桃市", "潛江市", "天門市", "神農架林區"],"湖南":["長沙市", "株洲市", "湘潭市", "衡陽市", "邵陽市", "岳陽市", "常德市", "張家界市", "益陽市", "郴州市", "永州市", "懷化市", "婁底市", "湘西土家族苗族自治州"],"海南":["海口市", "三亞市", "五指山市", "瓊海市", "儋州市", "文昌市", "萬寧市", "東方市", "定安縣", "屯昌縣澄邁縣", "臨高縣", "白沙黎族自治縣", "昌江黎族自治縣", "樂東黎族自治縣", "陵水黎族自治縣", "保亭黎族苗族自治縣", "瓊中黎族苗族自治縣"],};
  (function($) {
    $(document).ready(function() {
      var $provinceList=$("#province"),$cityList=$("#city"),provinceHTML="";
      for(province in address){
          var html="";
          provinceHTML+=html;
      }
      $provinceList.html(provinceHTML);
      $provinceList.on("click",function() {
        var province=$(this).val(),cityHTML="";
        for(city in address[province]){
          var html="";
          cityHTML+=html;
        }
        $cityList.html(cityHTML);
      })
      $provinceList.triggerHandler("click");
  })
  })(jQuery)

需要改進的地方

沒有對blur事件做出相應(triggerHandler(click)函數無效)

GPU云服務器云服務器省市選擇器選擇省市選擇器派生選擇器

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/79606.html

Vant - 高效的 Vue 組件庫，再造一個有贊移動商城也不在話下

摘要：優惠券選擇器優惠券選擇器提供了優惠券單元格和優惠券選擇功能。優惠券單元格只需傳入優惠券列表和當前使用的優惠券即可正確展示。使用參數可以控制優惠券單元格是否展示右側箭頭，這個可以用于提醒用戶能否切換優惠券。 Vant ( ?v?nt ) 是有贊前端團隊基于有贊統一的規范實現的 Vue 組件庫，提供了一整套 UI 基礎組件和業務組件。通過 Vant，可以快速搭建出風格統一的頁面，提升開發效...

tunny 2019-08-21 16:47 評論0 收藏0
Zent - 源自有贊微商城的 React 組件庫

摘要：是有贊端規范的實現版本，提供了一整套基礎的組件以及常用的業務組件。目前我們有組件，其中包括以及等實用的業務組件。一套有贊設計師繪制的圖標庫。為了解決這些問題，提供了一套自己的時間選擇組件，包括日期選擇周選擇組件月選擇以及時間區間選擇。 Zent ( ?zent ) 是有贊 PC 端 Web UI 規范的 React 實現版本，提供了一整套基礎的 UI 組件以及常用的__業務組件__。通...

Corwien 2019-08-21 17:34 評論0 收藏0
JavaWEB開發03——JS

摘要：返回包含帶有指定標簽名稱的所有元素的節點列表集合節點數組。增加節點創建屬性節點。刪除節點刪除子節點。今日任務使用JS完成頁面定時彈出廣告使用JS完成表單的校驗使用JS完成表格的隔行換色使用JS完成復選框的全選效果使用JS完成省市的聯動效果 JS控制下拉列表左右選擇教學導航掌握JS中的BOM對象掌握JS中的常用事件掌握JS中的常用DOM操作了解JS中的內置對象 ...

Travis 2019-08-02 11:49 評論0 收藏0
JavaWEB開發03——JS

摘要：返回包含帶有指定標簽名稱的所有元素的節點列表集合節點數組。增加節點創建屬性節點。刪除節點刪除子節點。今日任務使用JS完成頁面定時彈出廣告使用JS完成表單的校驗使用JS完成表格的隔行換色使用JS完成復選框的全選效果使用JS完成省市的聯動效果 JS控制下拉列表左右選擇教學導航掌握JS中的BOM對象掌握JS中的常用事件掌握JS中的常用DOM操作了解JS中的內置對象 ...

tomener 2019-08-29 17:05 評論0 收藏0
JavaWEB開發03——JS

摘要：返回包含帶有指定標簽名稱的所有元素的節點列表集合節點數組。增加節點創建屬性節點。刪除節點刪除子節點。今日任務使用JS完成頁面定時彈出廣告使用JS完成表單的校驗使用JS完成表格的隔行換色使用JS完成復選框的全選效果使用JS完成省市的聯動效果 JS控制下拉列表左右選擇教學導航掌握JS中的BOM對象掌握JS中的常用事件掌握JS中的常用DOM操作了解JS中的內置對象 ...

Gemini 2019-08-23 12:32 評論0 收藏0