一段简单的国家,省份和城市选择的脚本

在做Web应用时,经常会有这样的需求要求,要求用户选择所在的国家,省份和城市,一般是由3个select来控制的。我写了一个简单的脚本来使得其更方便的移植使用。

下载地址:http://alexcheng.myrice.com/CountryProvinceCitySelect.zip

程序主要由4个JavaScript脚本组成:

其中x.js是跨浏览器的库,主要用在事件处理方面,如果你不想添加这个库,修改CPCController.js的代码就可以了。

Messages_zh_CN.js是国际化所用的脚本,里面主要定义了3个变量,分别是:”请选择国家或地区”,”请选择省份”,”请选择城市”,可以自行修改,然后使用native2ascii转换即可。

具体 :

1 : 修改 CountryProvinceCity_zh_CN.ucd
2 : 保存到 c:\
3 : 打开 运行 cmd 切换到 c:\
4 : 输入 :


C:\>native2ascii -encoding GBK CountryProvinceCity_zh_CN.ucd CountryProvinceCity
_zh_CN.js

5 :用CountryProvinceCity_zh_CN.js覆盖原文件。


CountryProvinceCity_zh_CN.js是国家,省份和地区的列表。熟悉JSON的人一看就知道怎么写了。对于国家,CN就是select中option的value,name就是option的text。

CPCController.js就是最重要的控制逻辑所在了。

附带的2个ucd文件是转换之前的国际化文件。

里面的CPCTest.html给出了如何使用的例子,只需要一行代码就够了:

new CPCController(”homeCountry”, “homeProvince”, “homeCity”, CPC);

参数分别是3个选择框的ID,和列表对象。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
全球国家->省份/州->城市 数据表 国家表部分数据如下: SET FOREIGN_KEY_CHECKS=0; -- ---------------------------- -- Table structure for country -- ---------------------------- DROP TABLE IF EXISTS `country`; CREATE TABLE `country` ( `id` int(11) NOT NULL AUTO_INCREMENT, `country_code` varchar(100) NOT NULL DEFAULT '' COMMENT '国家代码', `country_name` varchar(100) NOT NULL DEFAULT '' COMMENT '英文国家名称', PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=260 DEFAULT CHARSET=utf8mb4 COMMENT='国家表'; -- ---------------------------- -- Records of country -- ---------------------------- INSERT INTO `country` VALUES ('1', 'AX', 'Aland Island'); INSERT INTO `country` VALUES ('2', 'AL', 'Albania'); INSERT INTO `country` VALUES ('3', 'DZ', 'Algeria'); INSERT INTO `country` VALUES ('4', 'AS', 'American Samoa'); INSERT INTO `country` VALUES ('5', 'AD', 'Andorra'); INSERT INTO `country` VALUES ('6', 'AO', 'Angola'); INSERT INTO `country` VALUES ('7', 'AI', 'Anguilla'); INSERT INTO `country` VALUES ('8', 'AG', 'Antigua And Barbuda'); INSERT INTO `country` VALUES ('9', 'AR', 'Argentina'); INSERT INTO `country` VALUES ('10', 'AM', 'Armenia'); INSERT INTO `country` VALUES ('11', 'AW', 'Aruba'); INSERT INTO `country` VALUES ('12', 'XD', 'Ascension'); 省份表部分数据如下 SET FOREIGN_KEY_CHECKS=0; -- ---------------------------- -- Table structure for province -- ---------------------------- DROP TABLE IF EXISTS `province`; CREATE TABLE `province` ( `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '关联city表的province_id', `country_id` int(11) NOT NULL DEFAULT 0 COMMENT '国家id', `province_name` varchar(100) NOT NULL DEFAULT '' COMMENT '省份名称', PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=3836 DEFAULT CHARSET=utf8mb4 COMMENT='省份表'; -- ---------------------------- -- Records of province -- ---------------------------- INSERT INTO `province` VALUES ('1', '2', 'Berat'); INSERT INTO `province` VALUES ('2', '2', 'Bulqize'); INSERT INTO `province` VALUES ('3', '2', 'Diber'); INSERT INTO `province` VALUES ('4', '2', 'Delvine'); INSERT INTO `province` VALUES ('5', '2', 'Durres'); INSERT INTO `province` VALUES ('6', '2', 'Devoll'); INSERT INTO `province` VALUES ('7', '2', 'Elbasan'); INSERT INTO `province` VALUES ('8', '2', 'Kolonje'); INSERT INTO `province` VALUES ('9', '2', 'Fier'); INSERT INTO `province` VALUES ('10', '2', 'Gjirokaster'); INSERT INTO `province` VALUES ('11', '2', 'Gramsh'); INSERT INTO `province` VALUES ('12', '2', 'Has'); INSERT INTO `province` VALUES ('13', '2', 'Kavaje'); INSERT INTO `province` VALUES ('14', '2', 'Kurbin'); INSERT INTO `province` VALUES ('15', '2', 'Kucove'); INSERT INTO `province` VALUES ('16', '2', 'Korce'); 城市表部分数据如下: DROP TABLE IF EXISTS `city`; CREATE TABLE `city` ( `id` int(11) NOT NULL AUTO_INCREMENT, `province_id` int(11) NOT NULL DEFAULT 0 COMMENT 'province表id', `city_name` varchar(100) NOT NULL DEFAULT '' COMMENT '城市名称', PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=381115 DEFAULT CHARSET=utf8mb4 COMMENT='城市表'; -- ---------------------------- -- Records of city -- ---------------------------- INSERT INTO `city` VALUES ('1', '120', 'ROSARIO.DE LA FRONTERA'); INSERT INTO `city` VALUES ('2', '120', 'SALTA'); INSERT INTO `city` VALUES ('3', '120', 'TRES CERRITOS'); INSERT INTO `city` VALUES ('4', '120', 'ROSARIO.DE LA LERMA'); INSERT INTO `city` VALUES ('5', '120', 'CERRILLOS'); INSERT INTO `city` VALUES ('6', '120', 'C. QUIJANO'); INSERT INTO `city` VALUES ('7', '120', 'CAMPO SANTO'); INSERT INTO `city` VALUES ('8', '120', 'GENERAL.GUEMES'); INSERT INTO `city` VALUES ('9', '120', 'METAN'); INSERT INTO `city` VALUES ('10', '120', 'CARRERA'); INSERT INTO `city` VALUES ('11', '120', 'EL GALPON'); INSERT INTO `city` VALUES ('12', '120', 'AGUAS BLANCAS'); INSERT INTO `city` VALUES ('13', '120', 'ORAN'); INSERT INTO `city` VALUES ('14', '120', 'TABACAL'); INSERT INTO `city` VALUES ('15', '120', 'COLONIA SANTA ROSA'); INSERT INTO `city` VALUES ('16', '120', 'PICHANAL'); 关于中国的部分城市数据: INSERT INTO `city` VALUES ('41614', '640', 'Qinzhou'); INSERT INTO `city` VALUES ('41615', '640', 'Yulin'); INSERT INTO `city` VALUES ('41616', '640', 'Baise'); INSERT INTO `city` VALUES ('41617', '640', 'Hezhou'); INSERT INTO `city` VALUES ('41618', '640', 'Hechi'); INSERT INTO `city` VALUES ('41619', '640', 'Chongzuo'); INSERT INTO `city` VALUES ('41620', '640', 'Laibin'); INSERT INTO `city` VALUES ('41621', '641', 'Shaoguan'); INSERT INTO `city` VALUES ('41622', '641', 'Guangzhou'); INSERT INTO `city` VALUES ('41623', '641', 'Zhuhai'); INSERT INTO `city` VALUES ('41624', '641', 'Shenzhen'); INSERT INTO `city` VALUES ('41625', '641', 'Foshan'); INSERT INTO `city` VALUES ('41626', '641', 'Shantou'); INSERT INTO `city` VALUES ('41627', '641', 'Zhanjiang'); INSERT INTO `city` VALUES ('41628', '641', 'Jiangmen'); INSERT INTO `city` VALUES ('41629', '641', 'Zhaoqing'); INSERT INTO `city` VALUES ('41630', '641', 'Maoming'); INSERT INTO `city` VALUES ('41631', '641', 'Meizhou'); 关于中国部分省份数据如下: INSERT INTO `province` VALUES ('653', '
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值