页面效果如下图所示:
js代码如下图所示:
//初始化省份、城市、区域下拉列表 $('#provinceId').combobox({ url:'demoAction!getProvinceJson.action', valueField:'provinceId', textField:'provinceName', onChange:function(){ var provinceId = $('#provinceId').combobox('getValue'); $('#cityId').combobox({ url:'demoAction!getCityJsonByProvinceId.action?provinceId='+provinceId, valueField:'cityId', textField:'cityName', onChange:function(){ var cityId = $('#cityId').combobox('getValue'); $('#areaId').combobox({ url:'demoAction!getAreaJsonByCityId.action?cityId='+cityId, valueField:'areaId', textField:'areaName', }); } }); } }); })
action代码如下图所示:
// ×××××××××××××××××××××××××××××××××××××××××××××××××××××××××× // ×××××××××××××××××××××××××××三级联动××××××××××××××××××××××× // ×××××××××××××××××××××××××××××××××××××××××××××××××××××××××× //进入上传页面 public String menuButton3(){ return "combobx3"; } //-----------------------得到区域列表--------------------------- //浏览器传递过来的信息 private String cityId; public String getCityId() { return cityId; } public void setCityId(String cityId) { this.cityId = cityId; } public void getAreaJsonByCityId(){ JSONArray jsonArray = new JSONArray(); JSONObject jsonObj = new JSONObject(); if("ft".equals(cityId)){ jsonObj.put("areaId", "xwy"); jsonObj.put("areaName", "小瓦窑"); jsonObj.put("selected", true); JSONObject jsonObj2 = new JSONObject(); jsonArray.add(jsonObj); jsonObj2.put("areaId", "yql"); jsonObj2.put("areaName", "玉泉路"); jsonArray.add(jsonObj2); } if("hd".equals(cityId)){ jsonObj.put("areaId", "zgc"); jsonObj.put("areaName", "中关村"); jsonObj.put("selected", true); JSONObject jsonObj2 = new JSONObject(); jsonArray.add(jsonObj); jsonObj2.put("areaId", "sd"); jsonObj2.put("areaName", "上地"); jsonArray.add(jsonObj2); } writeJson(jsonArray); }