ThinkPHP5:[三级联动]

数据表

静态

<div class="layui-form-item">
	<label for="username" class="layui-form-label">
	<span class="x-red">*</span>商品分类</label>
	<div>
		<select name="请选择商品分类" id="province" onchange="loadRegion('province',2,'city','{:url('Commlist/getRegion')}');"style="margin-top: 10px;">
			<option value="0" selected>请选择商品分类</option>
			{
     foreach $province as $vo}
				<option value="{$vo.id}">{
     $vo.name}</option>
			{
     /foreach}
		</select>
		<select name="city" id="city" onchange="loadRegion('city',3,'town','{:url('Commlist/getRegion')}');"style="margin-top: 10px;">
			<option value="0">请选择商品分类</option>
		</select>
		<select name="classify" id="town"style="margin-top: 10px;">
			<option value="0">请选择商品分类</option>
		</select>
	</div>
</div>

jQuery

<script>
				function loadRegion(sel,type_id,selName,url){
     
					jQuery("#"+selName+" option").each(function(){
     
					jQuery(this).remove();
				});
				jQuery("请选择商品分类").appendTo(jQuery("#"+selName));
					if(jQuery("#"+sel).val()==0){
     
					return;
				}
				jQuery.getJSON(url,{
     pid:jQuery("#"+sel).val(),type:type_id},
				function(data){
     
					if(data){
     
					jQuery.each(data,function(idx,item){
     
					jQuery("+item.id+">"+item.name+"").appendTo(jQuery("#"+selName));
				});
				}else{
     
				jQuery("请选择商品分类").appendTo(jQuery("#"+selName));
							}
						}
					);
				}
</script>

控制器

调用表与固定语句 最后回调函数给ajax