前端開發中，常用的幾種下拉框方式，包括：easyui中的combobox，combo，html中的select標籤<select></select>,struts2標籤：<s:select></s:select>。下面是我總結的這幾種下拉框的動態載入和動態選中的寫法，以防後面再遇到。

一、combobox，combobox:使用easyui外掛遠端請求資料方式

   combobox，combobox:使用easyui外掛遠端請求資料方式
    先定義input標籤:     <input id="xx" />
 

 ${"#xx"}.combobox({
	 valueField:'id',    
    	 textField:'text',
	 url:"請求資料的路徑"，
	 queryParams：{"age" : 25, "order" : "desc"}//帶額外的引數，當然也可以在url後面拼接引數
    });	
 

List  list = new ArrayList()//存放查詢的資料
                JSONArray jsonArr = new JSONArray();
		JSONObject jsonObj;
		jsonObj = new JSONObject();
		jsonObj.put("id", "");
		jsonObj.put("text", "全部");
		jsonObj.put("selected", true);
		jsonArr.add(jsonObj);
		if(null!=list){
			for(int i=0;i<list.size();i++){
				jsonObj = new JSONObject();
				jsonObj.put("id", list.get(i).xx);//對應的id
				jsonObj.put("text", list.get(i).getOpNo());//對應的text
				jsonObj.put("selected", false);
				jsonArr.add(jsonObj);
			}
			
		}
		return jsonArr.toString();
 

二.使用html中的使用select標籤 ：

  2.1 html標籤結合js 

  <select id="xx">
   <option value="0">選項1</option>
  </select> 

  document.getElementById("xx").options.add(new Option("mytest","1"));//新增
  document.getElementById("xx").remove("1");//刪除  這種適合適合新增的資料在js中獲取方便的。

  如果是通過action傳到前臺的資料是list，使用jquery不容易解析，因為jquery一般解析的是xml或json資料，所以
  如果使用上述方法動態新增下拉選項的話，要在後臺將資料轉成json資料，

2.2 由於html沒有迴圈功能，因此如果不在javascript中動態新增的話就無法實現， 但是可以我們可以藉助JSTL（c標籤） 標籤中的<c:forEach></c:forEach>迴圈list

  首先不要忘記引入jstl標籤
  

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

 <select  id="test" >
           <option value="1">選項一</option>
     <c:forEach items="${bopTmDataDictionaryList}" var="e">
          <option value="${e.id}"><c:out value="${e.chName}"/></option>
      </c:forEach>
 </select>

 三、使用也可以使用struts2標籤（s標籤）

    同樣不能忘記下引入s標籤

<%@taglib prefix="s" uri="/struts-tags"%>

 <s:select id="xx" name="xx" list="從後臺傳過來的list集合"
	 headerKey="預設的第一個選項的id" headerValue="預設的第一個選項的text"
	listKey="chName" listValue="chName" value='' >
 </s:select>

動態選中js程式碼：
 1、設定value為pxx的項選中（value相當於id）

$("#test").val("pxxid");

var options=$("#test").find("option");
		$.each(options,function(i,option){
			if($(option).attr("value")==你要選中的文字值){
				$(option).attr("selected",true);
			}
		});