下拉列表資料太多也會讓人眼花繚亂，有搜尋框就很容易的解決這個問題

一 、引入css js

<link href="${ctx}/js/jquerychose/chosen.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquerychose/chosen.jquery.js"></script>

jsp頁面寫法

<tr>
	<td>選擇城市：</td>
	<td height="32">
	<select id="financialIds" name="financialIds" style="width: 150px;" class="dept_select">
	  <option value="0" selected="selected">請選擇城市....</option>
		<s:iterator value="listCitys" > <!--後臺傳遞-->
		   <option value="<s:property value="cityId"/>" title="<s:property value="cityName"/>" id="cityId"><s:property value="cityName"/></option>
		</s:iterator>				
		</select><font color="#FF3300" size=4> * </font>		
	</td>
</tr>

<script type="text/javascript">
     jQuery('#sel_city').chosen();

</script>


 

jQuery("#financialIds").change(function(){
		var checkText=jQuery("#financialIds").find("option:selected").text(); //獲取Select選擇的Text 
			var checkValue=jQuery("#financialIds").val(); //獲取Select選擇的Value
			var checkTile=jQuery("#financialIds").find("option:selected").attr("title"); //獲取Select選擇的title 
			window.location.reload();//重新整理當前頁面.
})
 

http://download.csdn.net/detail/duankelin/9318281