【省市区三级联动】

html页面（注class需要增加一个layui-form）

<div class="row layui-form">
	<div class="col-sm-12  col-xs-12">
		<div class="form-group ">
		<label class="col-sm-2 control-label required">地址</label>
			<div class="layui-col-sm2">
				<div class="layui-inline layui-select-default" style="width: 99%;">
					<select name="province" id="province"  data-area="江苏省" lay-filter="province">
						<option value="">选择省</option>
					</select> 
				</div>
			</div>
			<div class="layui-col-sm4">
				<div class="layui-inline layui-select-default" style="width: 99%;">
					<select name="city" id="city" data-area="苏州市" lay-filter="city">
						<option value="">选择市</option>
					</select> 
				</div>
			</div>
			<div class="layui-col-sm4">
				<div class="layui-inline layui-select-default" style="width: 99%;">
					<select name="district"  id="district" data-area="姑苏区" lay-filter="district">
						<option value="">选择区</option>
					</select> 
				</div>
			</div>
		</div>
	</div>
	      	        	 
                  <input id=provinceString name="provinceString" type="hidden">	
                  <input id=cityString name="cityString" type="hidden">	
                  <input id=districtString name="districtString" type="hidden">	
</div>

JS部分
commonaddress.js 保存在/js目录下面

//config的设置是全局的
layui.config({
	base: '/js/' //假设这是你存放拓展模块的根目录
}).extend({ //设定模块别名
	common: 'commonaddress' //如果 common.js 是在根目录，也可以不用设定别名
});

layui.use(['form', 'common'], function(){
	var common = layui.common,
		form = layui.form;
	//do something...
	//三级地址联动
	common.showCity('province', 'city', 'district');

	//监听提交
	form.on('submit(formDemo)', function(data){
		var resData = data.field,
			province = resData.province,
			city = resData.city,
			district = resData.district;

		console.log(province, city, district)

		// 通过地址code码获取地址名称
		var address = common.getCity({
			province, 
			city,
			district
		});
		console.log(address);
		return false;
	});
	
});

	function submimForm() {
        //省
		$("#provinceString").attr("value",$("#province option:selected").text());
		//市
		$("#cityString").attr("value",$("#city option:selected").text());
		//区
		$("#districtString").attr("value",$("#district option:selected").text());
	  	return $.ajax({
	  		
			url : BASE_URL + '/undergroundspace/add',
			type : 'post',
			data : $("#addgroup").serialize(),
			dataType : 'json'
		})  
	}

commonaddress.js 内容如下

/**
 * @authors Mzong(mzong121491@gmail.com)
 * @date    2019-01-18 11:15
 * @requires  layui
 * @version $1.1.0$
 */
layui.define("layer", function(exports){ 
	console.log("here")
	//提示：模块也可以依赖其它模块，如：layui.define('layer', callback);
	var $ = layui.jquery,
		form = layui.form;
	console.log(form)
	// 返回的对象
	var returnObj = {	
		/**
		 * 省市县三级联动
		 *
		 * @param { string } [form] [form是layui.form对象]
		 * @param {string} [province] [省容器的name名字 ]
		 *    eg:<select name="province">
		 * @param {string} [city] [省容器的name名字]
		 * @param {string} [district] [县容器的name名字]
		 * @return {undefined} [无返回值]
		 */
		showCity: function(province, city, district) {
			console.log("provincecity")
			//AreaData是地址传过来的json对象
			var AreaData = $.rawCitiesData;
			if("undefined" == typeof AreaData) {
				layer.open({
					title: '系统提示'
					,content: '调用showCity之前请引入地址数据'
				}); 
				return;
			}
			var htmlProvince = '',
				htmlCity = '',
				htmlDistrict = '',
				cityData = '',
				districtData = '',
				$province = $('select[name='+province+']'),
				$city = $('select[name='+city+']'),
				$district = $('select[name='+district+']'),
				provVal = $province.attr('data-area') || '', // 省默认值
				cityVal = $city.attr('data-area') || '', // 市默认值
				distVal = $district.attr('data-area') || ''; // 县默认值
			$province.find('option').not(':first').remove();
			$city.find('option').not(':first').remove();
			$district.find('option').not(':first').remove();
			form.render('select');

			// 加载省数据
			loadProvince();
			function loadProvince() {
				AreaData.forEach(function(v, i) {
					htmlProvince += '<option value='+v.code+'>'+v.name+'</option>';
				});
				$province.append(htmlProvince);

				// 默认选中省
				defaultSelect($province, provVal, function(code) {
					cityData = findPlace(AreaData, code);
					loadCity(cityData, true);
				});

				form.render('select');

			}

			// 加载城市数据
			function loadCity(city, hasDefault) {
				$city.find('option').not(':first').remove();
				htmlCity = '';
				var city = city || [];
				city.forEach(function(v, i) {
					htmlCity += '<option value='+v.code+'>'+v.name+'</option>';
				});
				$city.append(htmlCity);

				// 默认加载才执行，手动选中不执行
				if (hasDefault) {
					// 默认选中城市
					defaultSelect($city, cityVal, function(code) {
						// console.log(code)
						// 加载默认城市数据
						districtData = findPlace(cityData, code);
						loadDistrict(districtData, true);
					});
				}

				form.render('select');
			}

			// 加载县数据
			function loadDistrict(districtData, hasDefault) {
				$district.find('option').not(':first').remove();
				htmlDistrict = '';
				var districtData = districtData || [];
				districtData.forEach(function(v, i) {
					htmlDistrict += '<option value='+v.code+'>'+v.name+'</option>';
				});
				$district.append(htmlDistrict);

				if (hasDefault) {
					// 默认选中县
					defaultSelect($district, distVal);
				}

				form.render('select');
			}

			// 查找地点数据
			function findPlace(data, code) {
				var resData = [];
				data.forEach(function(v, i) {
					if (v.code === code) {
						resData = v.sub
					}
				});

				return resData;
			}

			/* 
			* 查找默认选中项
			* @param {object} jq元素
			* @param {string} 默认值
			* @param {function} 回调函数
			*/ 
			function defaultSelect($el, SelectVal, callback) {
				$('option', $el).each(function(i, el) {
					var $this = $(this);
					var optVal = $this.html();
					var code;
					if (optVal == SelectVal) {
						$this.attr("selected", true);
						code = $this.val();
						// 加载默认城市数据
						callback && callback(code);
					}
				});
			}

			// 省选择
			form.on('select('+province+')', function(data) {
				var code = data.value;
				 console.log(data.elem); //得到select原始DOM对象
				 console.log(data.elem); //得到select原始DOM对象
				 console.log(code); //得到被选中的值
				if (code != '') {

					cityData = findPlace(AreaData, code);

					loadCity(cityData);
					loadDistrict();

				} else {
					loadCity();
					loadDistrict();
				}
				// console.log(data.othis); //得到美化后的DOM对象
			});
			// 市选择
			form.on('select('+city+')', function(data){
				var code = data.value;
				if (code != '') {

					districtData = findPlace(cityData, code);

					loadDistrict(districtData);
					// console.log(data.elem); //得到select原始DOM对象
				} else {
					loadDistrict();
				}
				// console.log(data.othis); //得到美化后的DOM对象
			});
			form.on('select('+district+')', function(data){
				// console.log(data.elem); //得到select原始DOM对象
				// console.log(data.value); //得到被选中的值
				// console.log(data.othis); //得到美化后的DOM对象
			});
		},
		/**
		 * 获取省市县数据
		 *
		 * @param { object } [address] [address eg:广东省广州市天河区]
		 * @return {object} [address][根据code码返回地址名称]
		 */
		getCity: function(address) {
			//AreaData是地址传过来的json对象
			var AreaData = $.rawCitiesData;
			if("undefined" == typeof AreaData) {
				layer.open({
					title: '系统提示'
					,content: '调用getCity之前请引入地址数据'
				}); 
				return;
			}
			var province = address.province,
				city = address.city,
				district = address.district,
				provinceName = '',
				cityName = '',
				districtName = '';

			function findIndex(arr, target) {
				return arr.findIndex(function(v, i) {
					return target == v.code;
				})
			}

			if (province) {
				var findProvinceIndex = findIndex(AreaData, province);
				provinceName = AreaData[findProvinceIndex].name;
			}

			if (province && city) {
				var findCityIndex = findIndex(AreaData[findProvinceIndex].sub, city);
				cityName = AreaData[findProvinceIndex].sub[findCityIndex].name;
			}

			if (province && city && district) {
				var findDistrictIndex = findIndex(AreaData[findProvinceIndex].sub[findCityIndex].sub, district);

				districtName = AreaData[findProvinceIndex].sub[findCityIndex].sub[findDistrictIndex].name;
			}

			return {
				provinceName: provinceName,
				cityName: cityName,
				districtName: districtName
			}
		}
	} 

	// exports module
	exports('common', returnObj);
});