jQuery带搜索功能省市区联动菜单代码

一款比较实用的jQuery带搜索功能省市区联动菜单代码，中国城市地区联动下拉框选择插件，有三种样式可选，可以在下拉项的搜索框内进行拼音搜索和中文汉字搜索。

分类：表单代码 > 城市选择难易：初级

查看演示下载资源下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

js代码

<script type="text/javascript" src="js/citydata.js"></script>
<script type="text/javascript" src="js/cityPicker-1.0.0.js?v=1"></script>
<script type="text/javascript">
	$(function () {

		//模拟城市-无联动/无搜索
		var selector = $('#city-picker-selector').cityPicker({
			dataJson: cityData,
			renderMode: true,
			search: false,
			linkage: false
		})
		$('#city-picker-selector').on('choose-province.citypicker', function(event, tagert, storage) {
			console.log(storage);
		});

		//设置城市
		selector.setCityVal([{
			'id': '110000',
			'name': '北京市'
		}, {
			'id': '110100',
			'name': '北京市'
		}, {
			'id': '110108',
			'name': '海淀区'
		}]);

		//模拟城市-联动/搜索
		$('#city-picker-search').cityPicker({
			dataJson: cityData,
			renderMode: true,
			search: true,
			linkage: true
		});

		//原生城市-无联动
		var select = $('.city-picker-select').cityPicker({
			dataJson: cityData,
			renderMode: false,
			linkage: false
		});

		//设置城市
		select.setCityVal([{
			'id': '140000',
			'name': '山西省'
		}, {
			'id': '140100',
			'name': '太原市'
		}, {
			'id': '140105',
			'name': '小店区'
		}]);
	});
</script>