<body>
<div>
<p><span class="serv_txt">所在城市:</span>
<div class="border">
<select id='province' name='provinceid' style="width: 80px">
<option value="-10" >省级</option>
<foreach name="province" item="v">
<option value="{{$v.id}}">{{$v.name}}</option>
</foreach>
</select>
<select id='city' name='cityid' style="width: 80px">
<option value="-10">市级</option>
</select>
<select id='area' name='countryid' style="width: 80px">
<option value="-10">区/县级</option>
</select>
</div>
</p>
</div>
</body>
<script src="./js/jquery.min.js"></script>
<script type="text/javascript">
//获取城市
$("select[id=province]").change(function(){
$("#area").html("<option value='-10'> 区/县级</option>");
var id = $(this).val();
//获取城市信息
var url = "{{:U('User/getChildren')}}" ;
var param = {id:id};
$.post(url,param,function(data){
var objs = eval("("+data+")");
$("#city").html("");
var str = "<option value='-10' >市级</option>" ;
objs.forEach(function(obj){
str += "<option value=\""+obj.id+"\" style='color:black'>"+obj.name+"</option>" ;
});
$("#city").append(str);
});
});
//获取区/县
$("select[id=city]").change(function(){
var id = $(this).val();
//获取城市信息
var url = "{{:U('User/getChildren')}}" ;
var param = {id:id};
$.post(url,param,function(data){
var objs = eval("("+data+")");
$("#area").html("");
var str = "<option value='-10' >区/县级</option>" ;
objs.forEach(function(obj){
str += "<option value=\""+obj.id+"\" style='color:black' >"+obj.name+"</option>" ;
});
$("#area").append(str);
});
});
</script>
<?php
//城市三级联动还有一个地区的数据库亲们就自己找找咯
public function getChildren(){
if(IS_AJAX){
$id = intval(I("id")) ;
$model = M("area") ;
$area = $model->field("id,name")->where($where=array("pid"=>$id))->select();
$this->ajaxReturn(json_encode($area));
}
}