最好用的省市二级联动 原生js实现你值得拥有


Posted in Javascript onSeptember 22, 2013
<script language=javascript> cities = new Object(); 
cities['台湾']=new Array('台北','台南','其他'); 
cities['马来西亚']=new Array('Malaysia'); 
cities['北京']=new Array('北京'); 
cities['上海']=new Array('上海'); 
cities['天津']=new Array('天津'); 
cities['重庆']=new Array('重庆'); 
cities['河北省']=new Array('石家庄', '张家口', '承德', '秦皇岛', '唐山', '廊坊', '保定', '沧州', '衡水', '邢台', '邯郸'); 
cities['山西省']=new Array('太原', '大同', '朔州', '阳泉', '长治', '晋城', '忻州', '吕梁', '晋中', '临汾', '运城'); 
cities['辽宁省']=new Array('沈阳', '朝阳', '阜新', '铁岭', '抚顺', '本溪', '辽阳', '鞍山', '丹东', '大连', '营口', '盘锦', '锦州', '葫芦岛'); 
cities['吉林省']=new Array('长春', '白城', '松原', '吉林', '四平', '辽源', '通化', '白山', '延边'); 
cities['黑龙江省']=new Array('哈尔滨', '齐齐哈尔', '黑河', '大庆', '伊春', '鹤岗', '佳木斯', '双鸭山', '七台河', '鸡西', '牡丹江', '绥化', '大兴安'); 
cities['江苏省']=new Array('南京', '徐州', '连云港', '宿迁', '淮阴', '盐城', '扬州', '泰州', '南通', '镇江', '常州', '无锡', '苏州'); 
cities['浙江省']=new Array('杭州', '湖州', '嘉兴', '舟山', '宁波', '绍兴', '金华', '台州', '温州', '丽水'); 
cities['安徽省']=new Array('合肥', '宿州', '淮北', '阜阳', '蚌埠', '淮南', '滁州', '马鞍山', '芜湖', '铜陵', '安庆', '黄山', '六安', '巢湖', '池州', '宣城'); 
cities['福建省']=new Array('福州', '南平', '三明', '莆田', '泉州', '厦门', '漳州', '龙岩', '宁德'); 
cities['江西省']=new Array('南昌', '九江', '景德镇', '鹰潭', '新余', '萍乡', '赣州', '上饶', '抚州', '宜春', '吉安'); 
cities['山东省']=new Array('济南', '聊城', '德州', '东营', '淄博', '潍坊', '烟台', '威海', '青岛', '日照', '临沂', '枣庄', '济宁', '泰安', '莱芜', '滨州', '菏泽'); 
cities['河南省']=new Array('郑州', '三门峡', '洛阳', '焦作', '新乡', '鹤壁', '安阳', '濮阳', '开封', '商丘', '许昌', '漯河', '平顶山', '南阳', '信阳', '周口', '驻马店'); 
cities['湖北省']=new Array('武汉', '十堰', '襄攀', '荆门', '孝感', '黄冈', '鄂州', '黄石', '咸宁', '荆州', '宜昌', '恩施', '襄樊'); 
cities['湖南省']=new Array('长沙', '张家界', '常德', '益阳', '岳阳', '株洲', '湘潭', '衡阳', '郴州', '永州', '邵阳', '怀化', '娄底', '湘西'); 
cities['广东省']=new Array('广州', '清远', '韶关', '河源', '梅州', '潮州', '汕头', '揭阳', '汕尾', '惠州', '东莞', '深圳', '珠海', '江门', '佛山', '肇庆', '云浮', '阳江', '茂名', '湛江'); 
cities['海南省']=new Array('海口', '三亚'); 
cities['四川省']=new Array('成都', '广元', '绵阳', '德阳', '南充', '广安', '遂宁', '内江', '乐山', '自贡', '泸州', '宜宾', '攀枝花', '巴中', '达川', '资阳', '眉山', '雅安', '阿坝', '甘孜', '凉山'); 
cities['贵州省']=new Array('贵阳', '六盘水', '遵义', '毕节', '铜仁', '安顺', '黔东南', '黔南', '黔西南'); 
cities['云南省']=new Array('昆明', '曲靖', '玉溪', '丽江', '昭通', '思茅', '临沧', '保山', '德宏', '怒江', '迪庆', '大理', '楚雄', '红河', '文山', '西双版纳'); 
cities['陕西省']=new Array('西安', '延安', '铜川', '渭南', '咸阳', '宝鸡', '汉中', '榆林', '商洛', '安康'); 
cities['甘肃省']=new Array('兰州', '嘉峪关', '金昌', '白银', '天水', '酒泉', '张掖', '武威', '庆阳', '平凉', '定西', '陇南', '临夏', '甘南'); 
cities['青海省']=new Array('西宁', '海东', '西宁', '海北', '海南', '黄南', '果洛', '玉树', '海西'); 
cities['内蒙古']=new Array('呼和浩特', '包头', '乌海', '赤峰', '呼伦贝尔盟', '兴安盟', '哲里木盟', '锡林郭勒盟', '乌兰察布盟', '鄂尔多斯', '巴彦淖尔盟', '阿拉善盟'); 
cities['广西']=new Array('南宁', '桂林', '柳州', '梧州', '贵港', '玉林', '钦州', '北海', '防城港', '南宁', '百色', '河池', '柳州', '贺州'); 
cities['西藏']=new Array('拉萨', '那曲', '昌都', '林芝', '山南', '日喀则', '阿里'); 
cities['宁夏']=new Array('银川', '石嘴山', '吴忠', '固原'); 
cities['新疆']=new Array('乌鲁木齐', '克拉玛依', '喀什', '阿克苏', '和田', '吐鲁番', '哈密', '博尔塔拉', '昌吉', '巴音郭楞', '伊犁', '塔城', '阿勒泰'); 
cities['香港']=new Array('香港'); 
cities['澳门']=new Array('澳门'); 
function set_city(province, city) 
{ 
var pv, cv; 
var i, ii; 
pv=province.value; 
cv=city.value; 
city.length=1; 
if(pv=='0') return; 
if(typeof(cities[pv])=='undefined') return; 
for(i=0; i<cities[pv].length; i++) 
{ 
ii = i+1; 
city.options[ii] = new Option(); 
city.options[ii].text = cities[pv][i]; 
city.options[ii].value = cities[pv][i]; 
} 
} 
</script> 
<SELECT name="sheng" id="to_cn" onchange="set_city(this, document.getElementById('city')); WYL();" class=login_text_input > 
<option value=0>请选择</option> 
<option value=台湾>台湾</option> 
<option value=马来西亚>马来西亚</option> 
<option value=北京>北京</option> 
<option value=上海>上海</option> 
<option value=天津>天津</option> 
<option value=重庆>重庆</option> 
<option value=河北省>河北省</option> 
<option value=山西省>山西省</option> 
<option value=辽宁省>辽宁省</option> 
<option value=吉林省>吉林省</option> 
<option value=黑龙江省>黑龙江省</option> 
<option value=江苏省>江苏省</option> 
<option value=浙江省>浙江省</option> 
<option value=安徽省>安徽省</option> 
<option value=福建省>福建省</option> 
<option value=江西省>江西省</option> 
<option value=山东省>山东省</option> 
<option value=河南省>河南省</option> 
<option value=湖北省>湖北省</option> 
<option value=湖南省>湖南省</option> 
<option value=广东省>广东省</option> 
<option value=海南省>海南省</option> 
<option value=四川省>四川省</option> 
<option value=贵州省>贵州省</option> 
<option value=云南省>云南省</option> 
<option value=陕西省>陕西省</option> 
<option value=甘肃省>甘肃省</option> 
<option value=青海省>青海省</option> 
<option value=内蒙古>内蒙古</option> 
<option value=广西>广西</option> 
<option value=西藏>西藏</option> 
<option value=宁夏>宁夏</option> 
<option value=新疆>新疆</option> 
<option value=香港>香港</option> 
<option value=澳门>澳门</option> 
</SELECT> - 市 
<select id="city" class=login_text_input name="shi"> 
<option value=0>请选择</option> 
</select>
Javascript 相关文章推荐
Javascript miscellanea -display data real time, using window.status
Jan 09 Javascript
css3元素简单的闪烁效果实现(html5 jquery)
Dec 28 Javascript
jquery控制页面部分刷新的方法
Jun 24 Javascript
JS打印组合功能
Aug 04 Javascript
ES6中Array.find()和findIndex()函数的用法详解
Sep 16 Javascript
Vue2.5通过json文件读取数据的方法
Feb 27 Javascript
修改npm全局安装模式的路径方法
May 15 Javascript
使用Vue实现图片上传的三种方式
Jul 17 Javascript
详解key在Vue列表渲染时究竟起到了什么作用
Apr 20 Javascript
关于ckeditor在bootstrap中modal中弹框无法输入的解决方法
Sep 11 Javascript
JS实现打砖块游戏
Feb 14 Javascript
Element Breadcrumb 面包屑的使用方法
Jul 26 Javascript
jquery的选择器的使用技巧之如何选择input框
Sep 22 #Javascript
JS+flash实现chrome和ie浏览器下同时可以复制粘贴
Sep 22 #Javascript
JS网页播放声音实现代码兼容各种浏览器
Sep 22 #Javascript
js和php如何获取当前url的内容
Sep 22 #Javascript
使用非html5实现js板连连看游戏示例代码
Sep 22 #Javascript
非html5实现js版弹球游戏示例代码
Sep 22 #Javascript
多种方法判断Javascript对象是否存在
Sep 22 #Javascript
You might like
PHP中使用cURL实现Get和Post请求的方法
2013/03/13 PHP
ThinkPHP中的三大自动简介
2014/08/22 PHP
php实现用于删除整个目录的递归函数
2015/03/16 PHP
详解PHP的Laravel框架中Eloquent对象关系映射使用
2016/02/26 PHP
运用Windows XP附带的Msicuu.exe、Msizap.exe来彻底卸载顽固程序
2007/04/21 Javascript
offsetParent 算法分析
2010/04/05 Javascript
轻量级 JS ToolTip提示效果
2010/07/20 Javascript
javascript生成json数据简单示例分享
2014/02/14 Javascript
nw.js实现类似微信的聊天软件
2015/03/16 Javascript
uploadify多文件上传参数设置技巧
2015/11/16 Javascript
跟我学习javascript的异步脚本加载
2015/11/20 Javascript
JQuery中attr属性和jQuery.data()学习笔记【必看】
2016/05/18 Javascript
jquery根据一个值来选中select下的option实例代码
2016/08/29 Javascript
谈谈因Vue.js引发关于getter和setter的思考
2016/12/02 Javascript
JavaScript函数参数的传递方式详解
2017/03/06 Javascript
JavaScript requestAnimationFrame动画详解
2017/09/14 Javascript
写gulp遇到的ES6问题详解
2018/12/03 Javascript
详解在微信小程序的JS脚本中使用Promise来优化函数处理
2019/03/06 Javascript
基于vue实现探探滑动组件功能
2020/05/29 Javascript
vue+iview实现分页及查询功能
2020/11/17 Vue.js
[10:39]DOTA2上海特级锦标赛音乐会纪录片
2016/03/21 DOTA
浅谈python为什么不需要三目运算符和switch
2016/06/17 Python
python使用xlrd与xlwt对excel的读写和格式设定
2017/01/21 Python
python2 与python3的print区别小结
2018/01/16 Python
浅谈Python对内存的使用(深浅拷贝)
2018/01/17 Python
在Pandas中给多层索引降级的方法
2018/11/16 Python
python实现滑雪游戏
2020/02/22 Python
在线服装零售商:SheIn
2016/07/22 全球购物
网络艺术零售业的先驱者:artrepublic
2017/09/26 全球购物
Hoover胡佛官网:美国吸尘器和洗地机品牌
2019/01/09 全球购物
美国眼镜在线零售商:Dualens
2019/12/07 全球购物
奥地利手表、香水、化妆品和珠宝购物网站:Brasty.at
2021/01/17 全球购物
2014迎新年晚会策划方案
2014/02/23 职场文书
中国梦口号
2014/06/13 职场文书
小学见习报告
2014/10/31 职场文书
新娘父亲婚礼致辞
2015/07/27 职场文书