上網(wǎng)找了一下下拉多選方面的插件，其中發(fā)現(xiàn)jquery.multiSelect是比較容易使用的一款，具體在文件附件里
?
下面用一個小例子說明一下：
?
需要在頁面中引入這些文件，jquery.js，jquery.bgiframe.min.js，jquery.multiSelect.js，jquery.multiSelect.css
?
html片段：
Java代碼??
- <form?id= "companyTypeForm" ?method= "post" ?name= "companyTypeForm" ?action= "companyType.do?method=save" >??
- ??<table?width= "100%" ?border= "0" ?cellspacing= "0" ?cellpadding= "0" >??
- ??<tr>??
- ????<td>類型名稱：</td>??
- ????<td>??
- ??????<input?type= "text" ?name= "name" ?/>??
- ????</td>??
- ????<td>擁有角色：</td>??
- ????<td>??
- ????????<select?id= "roleIds" ?name= "roleIds" ?style= "width:180px" ?multiple= "multiple" >??
- ????????????<c:forEach?items= "${roleList?}" ?var= "role" >??
- ????????????????<option?value= "${role.id?}" >${role.name?}</option>??
- ????????????</c:forEach>??
- ????????</select>??
- ????????????????<font?color= "red" ?id= "errRed" ></font>????????
- ?????</td>??
- ??</tr>??
- ????
- ??<tr>??
- ????<td?colspan= "4" >??
- ????????<input?name= "save" ?type= "submit" ?value= "保存" ?/>??
- ????????<input?name= "reset" ?type= "reset" ?value= "重置" ?/>??
- ????????</td>??
- ????</tr>??
- </table>??
- </form>??
?
js片段：
Js代碼??
- $(document).ready(? function ()?{??
- ??
- ????$( "#roleIds" ).multiSelect({???
- ????????selectAll:? false ,??
- ????????oneOrMoreSelected:? '*' ,??
- ????????selectAllText:? '全選' ,??
- ????????noneSelected:? '請選擇' ??
- ????},? function (){??? //回調(diào)函數(shù) ??
- ???????? if ($( "[name='roleIds']:checked" ).length?>?0)??
- ????????{??
- ????????????$( "#errRed" ).empty();??
- ????????}??
- ???????? else ??
- ????????{??
- ????????????$( "#errRed" ).text( "請選擇" );??
- ????????}??
- ????});??
- ??????
- });??
?就這么簡單的就用起來了！
?
博客：http://wang-min-zhao-sina-com.iteye.com/blog/1467204
?
?
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯(lián)系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點擊下面給點支持吧，站長非常感激您！手機微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
