省市县三级联动小结

html前端代码

<div class="ui-page">
    <div class="ui-container">
        <div class="ui-border-bottom f-bg-white f-pl-16 f-pr-16 f-pt-16 f-mb-16">
            <div class="ui-bfc f-fs-16 f-pb-12 f-pt-12">
                <div class="ui-bfc-aside f-color-title">收件人姓名</div>
                <input type="text" class="input-text" id="author" placeholder="请输入姓名">
            </div>

            <div class="ui-bfc ui-border-top f-fs-16 f-pb-12 f-pt-12">
                <div class="ui-bfc-aside f-color-title">收件人手机号码</div>
                <input type="text" class="input-text" id="tel" placeholder="请输入手机号">
            </div>

            <div class="ui-bfc ui-border-top f-fs-16 f-pb-12 f-pt-12">
                <div class="ui-bfc-aside f-color-title">地区信息</div>
                <select name="" id="sheng1" class="dizhi" οnchange="soncate1(this.options[this.options.selectedIndex].value)">
                  <option value="0">省</option>                   
                   <volist name="sheng" id="vo">
                
                    <option value="{$vo.area_id}">{$vo.area_name}</option>
                    </volist>
                </select>
                <div class="col-lg-8"  style="" id="shijuan1">
                <select name="" id="" class="dizhi">
                    <option value="">市</option>
                </select>
                </div>
                <div class="col-lg-8"  style="" id="shijuan2">
                <select name="" id="" class="dizhi">
                    <option value="">区/县</option>
                </select>
                </div>
            </div>

            <div class="ui-bfc ui-border-top f-fs-16 f-pb-12 f-pt-12">
                <div class="ui-bfc-aside f-color-title">详细地址</div>
                <input type="text" class="input-text" id="value" placeholder="详细地址">
            </div>
            <div class="ui-bfc ui-border-top f-fs-16 f-pb-12 f-pt-12">
                <div class="ui-bfc-aside f-color-title">邮编</div>
                <input type="text" class="input-text" id="url" placeholder="选择省市县自动生成邮编" readonly>
            </div>

            <div class="m-btn-box f-pd-16">
                    <span class="ui-btn ui-btn-primary" οnclick="create()">保存</span>
            </div>

        

    </div>
</div>
    <script>
        //父类的点击事件
        function soncate1(fid){

            $.post("{:U('index/soncate1')}",{"fid":fid},function(t){
                console.log(t);
                $("#shijuan1").html(t);
            });

        }
    </script>
    <script>
        //父类的点击事件
        function soncate2(fid){

            $.post("{:U('index/soncate2')}",{"fid":fid},function(t){
                console.log(t);
                $("#shijuan2").html(t);
            });

        }
    </script>
        <script>
        //父类的点击事件
        function soncate3(fid){

            $.post("{:U('index/soncate3')}",{"fid":fid},function(t){
                console.log(t);
                $("#url").val(t);
            });

        }
    </script>

php后台代码：

    //鍔ㄦ�佺殑鐢熸垚甯�
    public function soncate1(){

        $m_cms_city = M('cms_city');

        $maps['parentid'] = I("post.fid");

//        $maps['uid'] = getUID();
        $sonArr = $m_cms_city->where($maps)->select();

        if(!empty($sonArr)){
            foreach ($sonArr as $v){
                $opt .= "<option value='{$v['area_id']}'>{$v['area_name']}</option>";
            }
        }
        //鐢熸垚绗簩涓笅鏉ユ
        echo "<select name = 'shi' id='shi' class='dizhi' οnchange='soncate2(this.options[this.options.selectedIndex].value)'><option value='0' selected='selected'>甯�</option>{$opt}</select>";

        exit();
    }
    //鍔ㄦ�佺殑鐢熸垚鍖�
    public function soncate2(){

        $m_cms_city = M('cms_city');

        $maps['parentid'] = I("post.fid");

        $sonArr = $m_cms_city->where($maps)->select();

        if(!empty($sonArr)){
            foreach ($sonArr as $v){
                $opt .= "<option value='{$v['area_id']}'>{$v['area_name']}</option>";
            }
        }
        //鐢熸垚绗簩涓笅鏉ユ
        echo "<select name = 'qu' id='qu' class='dizhi' οnchange='soncate3(this.options[this.options.selectedIndex].value)'><option value='0' selected='selected'>鍖�/鍘�</option>{$opt}</select>";

        exit();
    }
        //鍔ㄦ�佺殑鐢熸垚閭紪
    public function soncate3(){

        $m_cms_city = M('cms_city');

        $maps['area_id'] = I("post.fid");

        $sonArr = $m_cms_city->where($maps)->find();

 
        echo $sonArr['zipcode'];

        exit();
    }