jQuery省市区镇四级联动插件citypicker.js

所属分类:输入-选择框

 1899  20  查看评论 (0)
jQuery省市区镇四级联动插件citypicker.js ie兼容8

使用方法

引入四个文件

  • jquery.js  (请把这个放首位引入)

  • city-picker.data.js  (全国省市区数据都在这个文件里面)

  • city-picker.js  (js实现功能逻辑)

  • city-picker.css  (省市区县选择器样式,这个也可以不用,可以自己写个更好看的) 

html页面代码:

<div style="position: relative;">
    <input class="form-control" readonly type="text" data-toggle="city-picker" style="width:50%;">
</div>

方法

用data-toggle="city-picker"属性初始化

基本

<div style="position:relative;">
  <input readonly type="text" data-toggle="city-picker">
</div>

自定义占位符

<div style="position:relative;">
  <input readonly type="text" data-toggle="city-picker" placeholder="customized placeholder...">
</div>

响应宽度

<div style="position:relative;">
  <input readonly type="text" data-toggle="city-picker" data-responsive="true" style="width:50%;">
</div>

自定义省/市/区

<div style="position:relative;">
  <input readonly type="text" data-toggle="city-picker" value="江苏省/常州市/溧阳市">
</div>

用$.fn.city-picker方法初始化

基本

$('#target').citypicker();

定制区域

$('#target').citypicker({
  province: '江苏省',
  city: '常州市',
  district: '溧阳市'
});
相关插件-选择框

省市县三级联动加载地图

可以本地控制插件、地区三级级联查询、地区联动地图的插件,在线搜索
  选择框
 14100  122

仿淘宝手机网站选择省市县效果

仿淘宝手机网站选择省市县效果
  选择框
 16627  113

jQuery联动下拉菜单

一款简单实用的联动下拉菜单,第一的条件未选择的情况下无法选择第二个,以此类推
  选择框
 6161  28

jQuery城市联动选择

jQuery城市三级联动选择
  选择框
 21142  154

讨论这个项目(0)回答他人问题或分享插件使用方法奖励jQ币

取消回复