#Plugin 中国省市选择插件
中国省市选择插件 ChineseCities
1.原生JS,不依赖jquery,zepto
2.前端学习交流群:814798690
源码查看 点击下载
快速使用
1.引用 ChineseCities.min.js
2.拷贝以下布局结构
<select id="province">
<option value="请选择城市">请选择省份</option>
</select>
<select id="city">
<option value="请选择城市">请选择城市</option>
</select>
3.创建ChineseCities对象:
var chineseCities = new ChineseCities({
'province':'province', //省份ID
'city':'city', //城市ID
'hasSelect': function(data){
console.log(data);
}//选择后的回调函数
});
可选参数
| 参数名 | 默认值 | 说明 |
| province | null | 省份下拉框ID |
| city | null | 城市下拉框ID |
| hasSelect | function(data){...} | 选择后的回调,返回数据{'province':'省份名','city':'城市名'} |
案例展示

#Plugin 中国省市选择插件的更多相关文章
- 4个好用的JS联动选择插件
jQuery City Select 一个简单的jQuery省市联动插件,可以自定义JSON字典实现其他内容的联动选择菜单. PCAS省.市.地区联动选择JS封装类 PCAS可能是国内使用人数最多的J ...
- 基于jquery的城市选择插件
城市选择插件的难度不是很大,主要是对dom节点的操作.而我写的这个插件相对功能比较简答,没有加入省市联动. 上代码好了,参照代码的注释应该比较好理解. /* *基于jquery的城市选择插件 *aut ...
- 【jquery】多日期选择插件easyui date
1.本次介绍一个好用的 多日期选择插件:EasyUI date,适用于:需要一次性选择多个日期,无需手动一个一个进行添加. 2.效果图: 3.下载地址:http://www.jeasyui.com/d ...
- 关于中国省市的一份js代码
下面是一份关于中国省市的js代码,搜藏起来,非常有用. var arrCity = [ { name:"请选择", sub:[{name:"请选择"}], ty ...
- 移动端城市选择JavaScript插件(基于WG的城市选择插件的修改版本)
周末的时候趁着一次机会,拿WG(博客)开发的城市选择插件改了一个移动端可以直接用的城市选择插件. 原版插件是基于原声JavaScript写的,在此先感谢作者. 我做的只是依照肯德基注册会员的页面的交互 ...
- Webform——中国省市三级联动以及IsPostBack
首先要明白Webform的运行顺序,当开始启动时候,首先执行的是Page_Load事件, 当点击任意按钮后,每次点击都要先执行一遍Page_Load(在这里Page_Load里面的事件是给数据控件加载 ...
- 贴近用户体验的jQuery日期选择插件
分享一款贴近用户体验的jQuery日期选择插件.这是一款双日历jQuery日期选择时间插件pickerDateRange.效果图如下: 在线预览 源码下载 var dateRange = new ...
- 纯原生js移动端城市选择插件
接着上一篇纯js移动端日期选择插件,话说今天同事又来咨询省市县联动的效果在移动端中如何实现,还是老样子,百度上一搜,诶~又全是基于jquery.zepto的,更加可恨的是大多数都是PC版的,三个sel ...
- 纯原生js移动端日期选择插件
最近在项目上需要使用日期选择插件,由于是移动端的项目,对请求资源还是蛮节约的,可是百度上一搜,诶~全是基于jquery.zepto的,本来类库就很大,特别像mobiscroll这种样式文件一大堆又丑又 ...
随机推荐
- angular学习总结
因为学习需要,要配置一系列环境,中间又出了很多各种各样的花式错误,因此当做个人总结记录一下.一.vs1. 完全卸载VS2013找到vs2013的安装包,如图 打开cmd命令行窗口,cd到安装包下的vs ...
- sql问题--case-when
1. 有表如下,请使用查询语句得出相应结果 id job createdate 1 开发 2018-06-19 2 运维 2018-06-20 3 开发 2018-06-19 4 开发 2018-06 ...
- Python day7之mysql
写在前面: 由于毕业论文撰写和答辩耽搁了几个月,但是在这几个月没有放弃学习Python,就是没有时间写博客.进行我们主要对数据库mysql的操作指令集的学习. 一.mysql术语 Mysql是最流行的 ...
- 自学huawei之路-6005-8AP设备启动界面
返回自学Huawei之路 自学huawei之路-AC6005-8AP设备启动界面 [YK-MES-MASTER] Please check whether system data has been c ...
- 解决小米note5 安装了google play store 打不开的问题
打不开的原因是缺少了google play store 运行的一些后台程序 去豌豆荚下载如下谷歌安装器(注:安装器有很多种,我试了如下这种成功) 重启手机,google play store 即可正常 ...
- 解决小程序中 cover-view无法盖住canvas的问题,仅安卓真机出现
原因在于系统页面渲染的差异,在安卓中页面dom的渲染并不是完成按照上下顺序来的, 有可能出现写在后面的dom被先渲染出来,因此会随机出现能盖住.不能盖住的情况,很诡异是不是? 开发者工具中并非真机,只 ...
- 安装R和Rstudio
安装R和Rstudio 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.安装R编程语言 1.登录下载网站 https://cran.r-project.org/ 2.点击下载链 ...
- SHELL (2) —— Shell变量的核心基础知识和实践
摘自:Oldboy Linux运维——SHELL编程实战 Shell变量:用一个固定的字符串(也可能是字符.数字等的组合)代替更多.更复杂的内容,该内容里可能还会包含变量.路径.字符串等其它的内容. ...
- GraphChi/graphchi-java程序配置
1.导入graphchi-java maven项目时报错: Plugin execution not covered by lifecycle configuration: org.scala-too ...
- MySQL主从复制部署
前言 MySQL的主从复制是基于二进制日志机制的,需开启二进制日志功能.在具体的配置过程中,需注意主服务器与从服务器均配置唯一ID编号,且从服务器必须设置主服务器的主机名.日志文件名.文件位置等参数. ...