jQuery 城市三级联动下拉框 - 酷炫特效,js特效,css3特效,html5特效 - CSS模版园-免费网站模版下载
当前位置 CSS模版园 >> 酷炫特效 >> jQuery 城市三级联动下拉框

jQuery 城市三级联动下拉框

jQuery 城市三级联动下拉框

城市三级联动菜单,支持城市街道查询

1、引入城市js

<script type="text/javascript" src="jquery.citys.js"></script>

2、初始化省市区下拉框

<select name="province"></select>
<select name="city"></select>
<select name="area"></select>

<script type="text/javascript">
	//填充下拉框
	$('.citys').citys({dataUrl:'citys.json',province:'四川',city:'成都',area:'锦江区'});
</script>

注意:填充select的数据源citys.json,为json格式文件,如果您的网站无法读取json文件,可以修改成txt文件读取


插件说明

1、调用方式

$(selector).citys(options,callback);

2、参数说明

参数 默认值 说明
dataUrl [数据库地址] 最新数据库(2016年7月):JSON格式JSONP格式
数据库项目:中国行政区划(省、市、区、街道)
dataType 'json' 数据库类型:'json'或'jsonp'
provinceField 'province' 省份(省级)字段名
cityField 'city' 城市(地级)字段名
areaField 'area' 地区(县区级)字段名
code 0 地区编码
province [无] 省份(省级),可以为地区编码或者名称
city [无] 城市(地级),可以为地区编码或者名称
area [无] 地区(县区级),可以为地区编码或者名称
required true 是否必须选中(是否自动选择地区)
nodata 'hidden' 当无数据时的表现形式:'hidden'隐藏,'disabled'禁用,为空不做任何处理
onChange [无] 地区切换时触发,回调函数传入地区信息:direct是否为直辖市,province省份(省级)名称,city城市(地级)名称,area地区(县区级)名称,code地区编码

callback(api)参数

方法 说明
getInfo(data) 获取当前选中的地区信息:direct是否为直辖市,province省份(省级)名称,city城市(地级)名称,area地区(县区级)名称,code地区编码

声明本站所有资源仅供学习与参考,请勿用于商业用途。转载请注明来自:cssteach.com

原文

推荐模版

热门网站模版

猜您喜欢

热门网站模版

热门网站模版

评论

若文章内容有错误或无法下载,请在回复中说明(可无需登录,直接评论)