1、引入select2的js文件,引入的文件需要在jquery文件后
<script type="text/javascript" src="__PUBLIC__/admin/js/select2.full.min.js"></script>
2、引入select2的css文件,引入的文件最好在自己的样式文件之前(便于对select2的样式进行自定义修改)
<link rel="stylesheet" href="__PUBLIC__/admin/css/select2.min.css">
3、使用时对直接选中select标签使用即可
例:
HTML
<select name="belong" id="belong">
<option value="index">首页</option>
<option value="flash">视频</option>
</select>
js
$("#belong").select2();
$("#belong").val(["flash"]).trigger("change"); //选中默认值(数组形式可用于多选的情况)
4、自定义select2的样式
css
.select2-selection{
width: 498px !important; //长度的设置
}
.select2-container--default .select2-selection--single{
border: 1px solid #cccccc; //边框颜色设置
outline:none; //外边框选中的样式
}
.dropdown-wrapper{
display: none; //隐藏可能产生的点击无效区域
}