其他代码
中国省市区地址三级联动jQuery插件
PetitQ
distpicker 是一款可以实现中国省市区地址三级联动 jQuery 插件。它使用简单，简单设置即可完成中国省市区地址联动效果。
HTML 结构：
基本的 HTML 结构是使用一个[div]容器来包裹一组[select]元素。
也想出现在这里？联系我们吧
<div><!-- container -->
<select></select><!-- 省 -->
<select></select><!-- 市 -->
<select></select><!-- 区 -->
</div>
你可以直接通过 data-toggle="distpicker"实现来进行初始化。
<div data-toggle="distpicker"><!-- container -->
<select></select><!-- 省 -->
<select></select><!-- 市 -->
<select></select><!-- 区 -->
</div>
也可以显示占位文本。
<div data-toggle="distpicker">
<select data-province="---- 选择省 ----"></select>
<select data-city="---- 选择市 ----"></select>
<select data-district="---- 选择区 ----"></select>
</div>
或者自定义省市区。
<div data-toggle="distpicker">
<select data-province="浙江省"></select>
<select data-city="杭州市"></select>
<select data-district="西湖区"></select>
</div>
初始化插件：
在页面 DOM 元素加载完毕之后，可以通过 distpicker()方法来初始化该地址联动插件。
$('#target').distpicker();
自定义占位文本：
$('#target').distpicker({
province: '---- 所在省 ----',
city: '---- 所在市 ----',
district: '---- 所在区 ----'
});
自定义省市区。
$('#target').distpicker({
province: '浙江省',
city: '杭州市',
district: '西湖区'
});
配置参数：
可以通过$().distpicker(options)来修改默认的配置参数，通过$.fn.distpicker.setDefaults(options)来修改全局默认参数。
autoSelect：类型：Boolean，默认值：true。是否当省改变时自动选择市和区
placeholder：类型：Boolean，默认值：true。是否显示占位文本
province：类型：String，默认值：—— 省 ——。定义省份的初始值，如果在 distpicker.data.js 文件中存在该省份，将会被选择，否则显示占位文本
city：类型：String，默认值：—— 市 ——。定义市的初始值，如果在 distpicker.data.js 文件中存在该市，将会被选择，否则显示占位文本
district：类型：String，默认值：—— 区 ——。定义区的初始值，如果在 distpicker.data.js 文件中存在该区，将会被选择，否则显示占位文本
方法：
reset([deep])：重置 select 为初始状态
deep (optional)：类型：Boolean，默认值：false。重置 select 为初始状态
例如：
$().distpicker('reset');
$().distpicker('reset', true);
destroy()：销毁插件实例。
distpicker 三级地址联动插件的 github 地址为：https://github.com/fengyuanchen/distpicker
| 演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
