通过下拉菜单选择省份异步调用城市
部份HTML代码如下
<div id="city_2"> <div class="diqu_sheng"> <select name="P1" city-req="1"> <option value="">--请选择省份--</option> <foreach name="diqu" item="v"> <option value="{$v.name}">{$v.name}</option> </foreach> </select> </div> <div class="diqu_shi"> </div> </div>
/** * 城市获取 - 市 */ $('.diqu_sheng select').live('change',function(){ var diqu_sheng = $(this).val(); if(diqu_sheng==''){ $('.diqu_shi').html(''); $('.diqu_xian').html(''); } else{ $('.diqu_shi').html('...'); $('.diqu_xian').html(''); $.post(url,{sheng:diqu_sheng},function(result){ //url为异步地址 $('.diqu_shi').html(result.html); },'json'); } }); /** * 城市获取 - 县、区 */ $('.diqu_shi select').live('change',function(){ var diqu_shi = $(this).val(); if(diqu_shi==''){ $('.diqu_xian').html(''); } else{ $('.diqu_xian').html('...'); $.post(url,{shi:diqu_shi},function(result){ $('.diqu_xian').html(result.html); },'json'); } });
这里是我们异步url的代码
//地区—,市,select选择形式 public function diquShi(){ $sheng = I('sheng'); $sheng = M('diqu')->where(array('pid'=>0,'name'=>$sheng))->limit(1)->select(); $pid = $sheng[0]['id']; $shi = M('diqu')->field(array('name'))->where(array('pid'=>$pid))->order('sort desc')->select(); $html = '<select name="city" required="true" id="cardtype" class="diqu_shi_select"><option value="">请选择</option>'; foreach($shi as $v){ $html .= '<option value="'.$v['name'].'">'.$v['name'].'</option>'; } $html .= '</select>'; $this->ajaxReturn(array('html'=>$html)); } //地区—,县,select选择形式 public function diquXian(){ $shi = I('shi'); $shi = M('diqu')->where(array('name'=>$shi))->limit(1)->select(); $pid = $shi[0]['id']; $qu = M('diqu')->field(array('name'))->where(array('pid'=>$pid))->order('sort desc')->select(); $html = '<select name="diqu_xian" required="true" id="cardtype" ><option value="">请选择</option>'; foreach($qu as $v){ $html .= '<option value="'.$v['name'].'">'.$v['name'].'</option>'; } $html .= '</select>'; $this->ajaxReturn(array('html'=>$html)); }