地区的联动 | 易学教程

PHP页面：

//二级联动public function diqu_show(){    $data=Db::table("area")->where("parent_id=0")->select();    //var_dump($data);die;    $aa=$data[0]['id']+100;    $shi_data=Db::table("area")->where("parent_id='$aa'")->select();   // var_dump($shi_data);die;    $arr=['data'=>$data,'shi_data'=>$shi_data];    return view("diqu_show",['arr'=>$arr]);}//市级public function shi_show(){    $parent_id=Request::instance()->param("parent_id");    $shi_data=Db::table("area")->where("parent_id='$parent_id'")->select();    return view("diqu_show2",['shi_data'=>$shi_data]);}//省级public function shiji_show(){    $shi=Request::instance()->param("shi");    $shi=Db::table("area")->where("parent_id='$shi'")->select();    return view("diqu_show3",['shi'=>$shi]);}HTML页面：diqu_show.html页面：

<!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="viewport"          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">    <meta http-equiv="X-UA-Compatible" content="ie=edge">    <title>Document</title></head><body><center>    <table>        <tr>            <td>                省区：                <select name="" id="" class="sheng">                    <option value="">请选择</option>                    {volist name="arr.data" id="v"}                    <option value="{$v.id}">{$v.name}</option>                    {/volist}                </select>            </td>            <td>                &nbsp;&nbsp;&nbsp;&nbsp;市级：                    <select name="" id="" class="shi">                        <option value="">请选择</option>                    </select>            </td>            <td>                &nbsp;&nbsp;&nbsp;&nbsp;县/区：                <select name="" id="" class="xian">                    <option value="">请选择</option>                </select>            </td>        </tr>    </table></center><script src="__STATIC__/js/jquery.min.js"></script><script>    $(function () {        $(document).on("change",".sheng",function () {            // var sheng=$("select option:selected").val();            var sheng=$(this).val();            //请求            $.get(                "{:url('index/shi_show')}?parent_id="+sheng,                function (data) {                    $(".shi").html(data)                }            )        })        $(document).on("change",".shi",function () {            // var sheng=$("select option:selected").val();            var shi=$(this).val();            //请求            $.get(                "{:url('index/shiji_show')}?shi="+shi,                function (data) {                    $(".xian").html(data)                }            )        })    })</script></body></html>diqu_show2.html页面

<option value="">请选择</option>{volist name="shi_data" id="v"}<option value="{$v.id}">{$v.name}</option>{/volist}

diqu_show3.html页面

<option value="">请选择</option>{volist name="shi" id="v"}<option value="{$v.id}">{$v.name}</option>{/volist}

来源：https://www.cnblogs.com/stj123/p/9787462.html

标签

data

option