中国省市选择插件  ChineseCities

1.原生JS,不依赖jquery,zepto
2.前端学习交流群:814798690

源码查看 点击下载

https://github.com/chaorenzeng/ChineseCities

快速使用

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':'城市名'}

案例展示

转载于:https://www.cnblogs.com/KevinTseng/p/9680175.html

#Plugin 中国省市选择插件相关推荐

  1. Magento银联支付模块|Magento1.9 Unionpay中国银联支付插件|支持PC、手机移动端支付|2016最新Unionpay5.0.0支付接口...

    2019独角兽企业重金招聘Python工程师标准>>> 功能 严格按照中国银联Unionpay)接口文档编写代码. 中国银联(Unionpay)异步通知机制,确保订单状态及时更新. ...

  2. 实时最新中国省市区县geoJSON格式地图行政边界数据Echarts地图数据(可精确到街道级)

    geojson 数据下载地址:https://hxkj.vip/demo/echartsMap/ 可下载的数据包含省级geojson行政边界数据.市级geojson行政边界数据.区/县级geojson ...

  3. 关于中国省市的一份js代码

    下面是一份关于中国省市的js代码,搜藏起来,非常有用. var arrCity = [{ name:"请选择", sub:[{name:"请选择"}], typ ...

  4. php日期选择插件,优雅的日期选择插件daterangepicker

    插件描述:jQuery bootstrap日期选择插件daterangepicker,多种时间类型选择 使用方法 第一步:引入css文件: bootstrap.min.css.font-awesome ...

  5. daterangepicker java_日期选择插件Date Range Picker

    Date Range Picker jQuery Date Range Picker 是一个基于 jQuery 的日期选择插件,使用起来也算方便,主要提 日期范围.单个日期 (时间.周.快捷键.每周其 ...

  6. 移动端日期选择插件rolldate

    rolldate为上一版jquery移动端时间插件的全新版本,目前保留了上一版的大部分功能,并且增加了回调函数,以及主题风格选取,最重要的是解决了上一版本的遗留问题,依赖jquery.滑动不够流畅.参 ...

  7. MAVROS的plugin到底是什么意思?plugin中文意思是插件

    MAVROS的plugin到底是什么意思?plugin中文意思是插件,应该是对应的消息处理插件,之所以说是插件应该是可以由我们自己去添加或者删除,官方自己也可以后面一点点增加,并不影响MAVROS本体 ...

  8. 使用echarts完成中国省市区县镇地图展示

    目录 前言 一.中国地图 1.1 地图数据-china.js 1.2 代码应用 二.省份地图--以山东为例,其他省份同理 2.1 地图数据-shandong.js 2.2 代码应用 三.市级地图--以 ...

  9. html页面酒店日历插件,基于vue2.x的酒店日历选择插件

    基于vue2.x的酒店日历选择插件 效果图 快速使用安装: npm install -S vue-hotel-calendar 或者 yarn add vue-hotel-calendar 使用: i ...

最新文章

  1. [Android]转-Android 中的拿来主义(编译,反编译,AXMLPrinter2,smali,baksmali)!
  2. linux下puppet的“资源”管理
  3. 《Linux内核设计与实现》读书笔记(十)- 内核同步方法
  4. Hadoop权威指南 _01前言感悟
  5. leedcode05 找出缺失的观测数据(思路加详解)
  6. 分布式队列编程:模型、实战
  7. 一对多 java_mybatis一对多和多对一
  8. git 删除本地仓库中的分支_git常用命令行 新建分支 删除分支 提交
  9. Bootstrap让内容块居中
  10. (15) 常用管理类软件需求征集 -- 通用菜单模块管理
  11. 《数据库系统概念》19-并发控制
  12. 翻译:YOLOv5 新版本——改进与评估
  13. 学生管理系统 c语言版
  14. 金融领域7大数据科学案例
  15. 线程调度及进程调度详解
  16. Gradle下载安装 使用本地Maven仓库 IDEA2020.1配置Gradle
  17. php抓取微信文章图片保存到本地
  18. 安卓手机管理_七色米ERP(七色米ERP进销存管理)V1.2.1 安卓手机版
  19. 区块链-高级密钥和地址
  20. 爬虫实现中英文的词语和句子互译

热门文章

  1. Netweaver和CloudFoundry的服务器日志
  2. android往天气接口里面传城市,Android使用中国天气网API数据通过城市名称获取天气情况...
  3. 单片机c语言必背代码_【典藏】深度剖析单片机程序的运行(C程序版)
  4. python 枚举相等判断_python中is和==的区别
  5. 大华供应链管理平台_files_锦江全球采购平台SRM系统2.0版本上线 打造更智能的供应链...
  6. 微服务feignclient_[Spring cloud 一步步实现广告系统] 11. 使用Feign实现微服务调用
  7. matlab安装配置vc出错,64位系统安装matlab出现mexopts.bat及出现缺少或无法安装c++ compilers 故障的解决办法.pdf...
  8. yarn的基本组成和工作流程
  9. 计算机考试单元格,计算机等级考试技巧在Excel中如何对单元格进行设置?
  10. 三维重建 几何方法 深度学习_Occupancy Networks:基于学习函数空间的三维重建表示方法...