程序博客网 > win10系统改mac地址

省市县三级联动（与后台仅交互一次）

来源：互联网发布：win10系统改mac地址编辑：程序博客网时间：2024/05/23 18:07

<script type="text/javascript">

   // 省市县三级假数据，实际开发中，该变量的值可改为AJAX获取
   var area = "[{id:101,name:'北京',pid:0},{id:102,name:'山东',pid:0},{id:103,name:'河北',pid:0},{id:201,name:'海淀区',pid:101},{id:202,name:'丰台区',pid:101},{id:203,name:'朝阳区',pid:101},{id:210,name:'济南',pid:102},{id:211,name:'青岛',pid:102},{id:212,name:'烟台',pid:102},{id:220,name:'石家庄',pid:103},{id:221,name:'邯郸',pid:103},{id:222,name:'邢台',pid:103},{id:301,name:'长清',pid:210},{id:302,name:'市中区',pid:210},{id:303,name:'章丘',pid:210},{id:304,name:'市南区',pid:211},{id:305,name:'黄岛',pid:211},{id:306,name:'平度',pid:211}]";

   // 将字符串转成JSON对象
   var areaJson = eval("(" + area + ")");

   // 页面加载完成后执行的方法
   $(function(){

       renderProvince();

       var selectedProvinceId = $("#provinceSelect").val();

       renderCity(selectedProvinceId);

       var selectedCityeId = $("#citySelect").val();

       renderCountry(selectedCityeId);
   });

   // 渲染【省】下拉框
   function renderProvince(){

       for(var i=0; i<areaJson.length; i++){

           if(areaJson[i].pid == 0){
               var provinceOption = "<option value="+areaJson[i].id+">"+areaJson[i].name+"</option>";
               $("#provinceSelect").append(provinceOption);
           }
       }
   }

   // 渲染【市】下拉框
   function renderCity(provinceId){

       $("#citySelect").empty();

       for(var i=0; i<areaJson.length; i++){

           if(areaJson[i].pid == provinceId){
               var cityOption = "<option value="+areaJson[i].id+">"+areaJson[i].name+"</option>";
               $("#citySelect").append(cityOption);
           }
       }
   }

   // 渲染【县】下拉框
   function renderCountry(cityId){

       $("#countrySelect").empty();
       for(var i=0; i<areaJson.length; i++){

           if(areaJson[i].pid == cityId){
               var countryOption = "<option value="+areaJson[i].id+">"+areaJson[i].name+"</option>";
               $("#countrySelect").append(countryOption);
           }
       }
   }

   // 刷新【市】和【县】两级下拉框
   function refreshCitySelect(){

       var selectedProvinceId = $("#provinceSelect").val();

       renderCity(selectedProvinceId);

       var selectedCityeId = $("#citySelect").val();

       renderCountry(selectedCityeId);
   }

   // 刷新【县】下拉框
   function refreshCountrySelect(){

       var selectedCityeId = $("#citySelect").val();

       renderCountry(selectedCityeId);
   }

</script>

<body>

<div>省市县三级联动</div>
<div id="luckyName">

   <select id="provinceSelect" onchange="refreshCitySelect()"></select>

   <select id="citySelect" onchange="refreshCountrySelect()"></select>

   <select id="countrySelect"></select>★★★★★

</div>

</body>

0 0

win10系统改mac地址

win10系统改mac地址

原创粉丝点击

热门问题 老师的惩罚人脸识别我在镇武司摸鱼那些年重生之率土为王我在大康的咸鱼生活盘龙之生命进化天生仙种凡人之先天五行春回大明朝姑娘不必设防，我是瞎子斯丹曼簇个人资料赞达亚科尔曼曼曼性8轻读在线听柔桡轻曼作品顾曼曼黎瑾泽全文免费加里奥德曼曼乐环贝克曼曼城8比0大胜德国曼曼卡车曼的拼音曼的意思曼组词韵诗曼祛斑霜价格曼咖啡曼姿旗舰店曼姿兰曼伯斯旗舰店念曼旗舰店茵曼inman 淘宝茵曼旗舰店茵曼怎么样曼芯雅霍斯曼壁挂炉茵曼女装代理曼瑞德分水器法儿曼曼丁之狮曼丁曼丁之狮故事曼丁之狮松迪亚塔曼丁之狮民间故事曼丁之狮主要内容曼丁之狮民间故事概括曼丁在线播放曼丁之狮缩写曼丁mandingo 曼丁之狮松迪亚塔的英雄故事曼丹曼丹眼唇卸妆液