地区二级联动+input模糊查询

<script type="text/javascript">
var TempArr=[];//存储option  
$(function(){  
    /*先将数据存入数组*/  
    $("#province option").each(function(index, el) {  
        TempArr[index] = $(this).text();  
    });  
    $(document).bind('click', function(e) {    
        var e = e || window.event; //浏览器兼容性     
        var elem = e.target || e.srcElement;    
        while (elem) { //循环判断至跟节点，防止点击的是div子元素     
            if (elem.id && (elem.id == 'province' || elem.id == "txt_province")) {    
                return;    
            }    
            elem = elem.parentNode;    
        }    
        $('#province').css('display', 'none'); //点击的不是div或其子元素     
    });    
})  
 
 function changeF(this_) {
    $(this_).prev("input").val($(this_).find("option:selected").text());  
    $("#province").css({"display":"none"});  
}   
function setfocus(this_){  
    $("#province").css({"display":""});  
    var select = $("#province");  
    for(i=0;i<TempArr.length;i++){
        var option = $("<option></option>").text(TempArr[i]);
        select.append(option);  
    }
    setinput(this_);  
}  
 
function setinput(this_){  
    var select = $("#province").val();  
    select.html("");  
    for(i=0;i<TempArr.length;i++){  
        //若找到以txt的内容开头的，添option  
        if(TempArr[i].substring(0,this_.value.length).indexOf(this_.value)==0){  
            var option = $("<option></option>").text(TempArr[i]);  
            select.append(option);  

        }  
    }  
}  

</script>

-------------------------------------------------------------------------------------------------------------------------------------------------

<script>
var jsonLocation = JSON.parse('<?php echo json_encode($locations);?>');
function loadCity() {
    //jQuery.parseJSON
    var target = $('#city');
    var province_code = $('#province').val();
    if (province_code == 0) {
        target.html('<option value="0">请选择</option>');
    } else {
        /* alert('test' + province_code); */
        var html = '<option value="0">请选择</option>';
        var jsonList = jsonLocation[province_code];
        for(var i in jsonList){
            /* console.log(jsonList[i]); */
            html += '<option value="' + jsonList[i].id + '">' + jsonList[i].name + '</option>';
        }
        target.html(html);
    }
}
</script>

-----------------------------------------------------------------------------------------------------------

<input type="text" class="form-control signedPersonIdCard"  style = "width:100%;" name="txt_province" id="txt_province"  οnfοcus="setfocus(this)"  οninput="setinput(this);" placeholder="省份/直辖市"></input>
                        <select name="province" id="province"  style = "display:none; position: fixed;z-index: 100;width:161px;" size="4" οnchange="javascript:changeF(this);loadCity();">
                           <!-- <option value="" selected>省份/直辖市</option> -->
                           <volist name="locations[0]" id="locations[0]" >
                                <option value="{$locations[0]['id']}" {$locations[0]['id']==$city[0]['province']?'selected':''}>{$locations[0]['name']}</option>
                           </volist>
                        </select>
                     </div>
                     <div class="col-sm-6">
                        <input type="text" class="form-control signedPersonIdCard"  style = "width:100%;" name="txt_city" id="txt_city" οnfοcus="setfocuss(this)" οninput="setinputs(this);" placeholder="市/县"></input>
                        <select name="city" id="city" style = "display:none; position: fixed;z-index: 100;width:161px;" size="4" οnchange="changeFs(this)">
                          <!-- <option value="" selected>市/县</option> -->
                        </select>

-----------------------------------------------------------------------------------------------------------

控制器获取列表

/**
     * 获取地区列表
     */
    public function getList() {
        $Area = M ( 'area' );
        $ret = array ();
        $rowset = $Area->field ( array (
                'id',
                'name',
                'parent_id',
                'layer'
        ) )->order ( 'id asc,layer,parent_id' )->select ();
        foreach ( $rowset as $row ) {
            // 省
            if ($row ['layer'] == 1) {
                $ret [0] [] = array (
                        'id' => $row ['id'],
                        'name' => $row ['name'],
                        'layer' => $row ['layer']
                );
            } else {
                $ret [$row ['parent_id']] [] = array (
                        'id' => $row ['id'],
                        'name' => $row ['name'],
                        'layer' => $row ['layer']
                );
            }
        }
        return $ret;
    }