HTML内容:
<li>
<span>一级分类:</span>
<select name="yjid" class="yjid">
<option value="">---所属分类---</option>
<volist name="list" id="vo">
<option value="{$vo['id']}">{$vo['name']}</option>
</volist>
</select>
</li>
<li>
<span>二级分类:</span>
<select name="ejid" class="ejid">
<option value="">---所属分类---</option>
</select>
</li>
jQuery内容:
<script>
$(function(){
$('.yjid').change(function(){
var yjid = $('.yjid').val();
$.ajax({
url:"{:U('index/daohang_add_ajax')}",
type:"POST",
async:true,
dataType:"json",
data:{'yjid':yjid},
success:function(data){
var str = "";
$.each(data, function(index, value){
str += '<option value="' + value.subid + '">' + value.subname + '</option>';
});
//清空之前其他上级菜单遗留的子菜单,否则改变上级菜单后子菜单会包含多个上级菜单的全部子菜单
$('.ejid').empty();
$('.ejid').append('<option value="">---所属分类---</option>' + str);
},
});
});
});
</script>
thinkphp内容:
//显示一级分类
public function daohang_add(){
if(!session('username')){
$this->redirect('login/login');
}
$list = M('type')->select();
$this->assign('list', $list);
$this->display();
}
//显示对应二级分类
public function daohang_add_ajax(){
if(!session('username')){
$this->redirect('login/login');
}
$data = I('yjid');
$list = M('sub_type')->where('typeid='.$data)->select();
$this->ajaxReturn($list, 'json');
}