Think PHP 5.0 分类数据三级联动_php三级分类移动分类时更新-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_59527682/article/details/121356360

该博客展示了如何使用前端JavaScript实现动态加载二级、三级分类联动效果。通过监听选择框变化，根据用户选择的一级分类ID发送Ajax请求，获取并渲染二级分类；同样，当二级分类被选中时，再次请求获取并渲染三级分类。后端使用PHP提供数据接口，返回分类数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.前端代码

<form action="">
    <select name="pid" id="one" class="form-control">
        <option value="">---请选择一级分类---</option>
        {volist name="data" id="vo"}
            <option value="{$vo.id}">{$vo.cate_name}</option>
        {/volist}
    </select>
    <select name="" id="two" class="form-control">
        <option value="">---请选择二级分类---</option>
    </select>
    <select name="" id="three" class="form-control">
        <option value="">---请选择三级分类---</option>
    </select>
</form>

<script>
    //根据ID给一个页面改变事件
    $('#one').change(function () {
        //获取一级分类的pid
        var pid=$(this).val();
        //请求数据
        $.post('refer',{pid:pid},function (res) {
            if (res.code==0){
                //拼接数据并渲染到页面
                var str='<option value="">---请选择二级分类---</option>';
                $.each(res.data,function (k,v) {
                    str+='<option value='+v.id+'>'+v.cate_name+'</option>'
                })
                $('#two').html(str);
            }
        },'json')
    })
    $('#two').change(function () {
        var pid=$(this).val();
        $.post('refer',{pid:pid},function (res) {
            console.log(res)
            if (res.code==0){
                var str='<option value="">---请选择三级分类---</option>';
                $.each(res.data,function (k,v) {
                    str+='<option value='+'v.id'+'>'+v.cate_name+'</option>'
                })
                $('#three').html(str);
            }
        },'json')
    })
</script>

2.后端代码

public function show(){
    $model=new Tpshop_category();
    $data=$model->where('pid',0)->select();
    //将一级分类数据先行返回到页面
    return view('./show',compact('data'));
}
public function refer(){
　　//获取前台传来的pid
    $pid=Request::instance()->param('pid');
    $model=new Tpshop_category();
    //根据pid获取数据
    $data=$model->where('pid',$pid)->select();
    return ['code'=>0,'data'=>$data,'msg'=>''];
}