你的位置:首页 > Java教程

[Java教程]三级城市联动菜单


三级城市联动菜单,也可以实现无限级联动,没有下限、、、

废话不多说,直接上代码。

<select name="provinceid" id="provinceid" onchange="change_city($(this))" data-target="cityid">  <option>请选择全国省份</option></select><select name="cityid" id="cityid" onchange="change_city($(this))" data-target="three_cityid">  <option>...</option></select><select name="three_cityid" id="three_cityid">  <option>...</option></select>

 

data-target这边是个关键,对应下级需要更改的对象ID。

function change_city($this){  var nextObjectId = $this.attr('data-target');  if (nextObjectId != undefined){    $.get(ajaxUrl,{id:$this.val()},function(data){      $("#"+nextObjectId).html(data);      change_city($("#"+nextObjectId));    });  }}

 

这边其实就是一个递归,没什么技术含量

这边可能会有性能上的一些影响。如果纠结这个,可以把ajax请求在js这层处理。