第一次寫博客，為了就是記錄自己的學習歷程，做一個整理

業務需求：有兩個下拉列表，部門列表和職位列表，實現級聯

1:本功能是在strut2框架下完成的，在進入頁面時通過action初始化部門下拉列表

前臺代碼如下：

<s:select list="departmentList" id="deparmentId"name="departmentId" headerKey="" headerValue="請選擇" listKey="departmentId" listValue="name" onchange="setEvent()" > </s:select><s:select list="jobList" id="jobId"name="jobId" headerKey="" headerValue="請選擇"> </s:select>

2：當選擇具體的部門時觸發onchang事件，進入js函數

function setEvent(){//獲取選中的部門idvar code = $("#departmentId").val();//獲取職位對象var jobs = $("#jobId");//異步訪問后臺，獲取所選部門的所有職位 $.ajax({type:"post",data:{"departmentId",code},url: "department_init.action";//后臺處理的action方法success:function(jobs){$.each(jobs , function(i){$("<option>" , {val:jobs[i].id , //這兩個都是后臺獲取的[ { id : "" , name : "" },{id : "" , name : " "} ]這種格式的數據，是在后臺構造的json格式的數據 text:jobs[i].name}).appendTo(jobs);});}dataType: "json"});}

3:departmentAction中的init()方法

代碼如下：

public void init(){this.getResponse().setContentType("text/html;charset=GBK"); this.getResponse().setCharacterEncoding("GBK"); PrintWriter pw=null;try {pw = this.getResponse().getWriter();} catch (IOException e) {e.printStackTrace();}//以下是根據部門id查詢職位的方法，,sql語句邏輯如下List jobs= departmentService.find(" select t.id , t.name from jobs t where t.departmentid="+deparmtnetId+" " );//轉換為json格式StringBuffer buff=new StringBuffer();buff.append("[");for(int i=0;i<jobsList.size();i++){Object[] obj = (Object[])jobsList.get(i);buff.append("{");buff.append("\"id\":"+obj[0].toString+",");buff.append("\"name\":\""+obj[1].toString+"\"");if(i==list.size()-1){buff.append("}");}else{buff.append("},");}}buff.append("]");//輸出 pw.write(buff.toString());}

?

以上三步就能實現部門和職位的記錄，這種方法可以用于各種級聯下拉列表

第一次寫，難免有錯誤，如果有錯誤希望各位博友指正

?

?

?

轉載于:https://www.cnblogs.com/jhw0703/archive/2013/01/10/wjh_123.html

總結

以上是生活随笔為你收集整理的基本java，jquery异步 的级联下拉列表的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。