select 下拉多选

本文主要是介绍select 下拉多选，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

一、使用multiple-select.js和multiple-select .css实现

HTML代码：

<select id='checkedLevel' style="width:120px;height:28px;" multiple="multiple"><option value="1">选项1</option><option value="2">选项1</option><option value="3">选项1</option><option value="4">选项1</option><option value="5">选项1</option><option value="6">选项1</option><option value="7">选项1</option></select>

js代码：

$('#checkedLevel').multipleSelect({addTitle: true, //鼠标点悬停在下拉框时是否显示被选中的值selectAll: false, //是否显示全部复选框，默认显示name: "质控级别",selectAllText: "选择全部", //选择全部的复选框的text值allSelected: "全部", //全部选中后显示的值//delimiter: ', ', //多个值直接的间隔符，默认是逗号placeholder: "质控级别" //不选择时下拉框显示的内容
});//设置默认选中:其中数组中多个值用逗号分隔，值是option的value$("#checkedLevel").multipleSelect('setSelects', [1001,1002]);

设置选中后关闭下拉框：
        $('#selectJcjb').multipleSelect("close");//其他的方法，可到js中去查看方法名，根据实际情况进行调用。

参照网址：http://wenzhixin.net.cn/p/multiple-select/docs/index.html?locale=zh_CN#with-optgroups1

https://www.jqueryscript.net/form/jQuery-Plugin-For-Selecting-Multiple-Elements-Multiple-Select.html

提示：也可以使用bootstrap.multiselect实现，参照网址：http://davidstutz.de/bootstrap-multiselect/

这篇关于select 下拉多选的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---