多选下拉框 jquery.multiple.select的使用
介绍:多选下拉选择插件是jQuery插件选择复选框,多元素的。有单选、多选还有其他分组多选、过滤条件选择等等。
相关API及demo:http://wenzhixin.net.cn/p/multiple-select/docs/#multiple-select
以下是项目中曾用的demo:
1.首先引用jquery.multiple.select.js、multiple-select.css
2.在页面select下拉列表里面加一个multiple="multiple"
<select name="nimbusHost" id="nimbusHost" multiple="multiple">
<c:forEach items="${stormIps}" var="item">
<option value="${item.value}">${item.code}</option>
</c:forEach>
</select>
3.在页面初始化的时候,要在js里面加一段代码:
<%--这个是默认选中的--%> var numbusIps='${queryStormBaseConfInfo.nimbusHost}'; $('#nimbusHost').multipleSelect({ width: '300px', single:true//单选,去掉single就是多选 }).multipleSelect('setSelects',[numbusIps]); <%--这个是默认不选中的--%> var numbusIps='${queryStormBaseConfInfo.nimbusHost}'; $('#nimbusHost').multipleSelect({ width: '300px', single:true//单选,去掉single就是多选 });
4.提交的时候直接用var nimbusHost=$("#nimbusHost").val();就可以得到多选下拉框选中的值。