bootstrap-select.js 下拉框多选后动态赋值
2018-02-28 17:38
736 查看
话不多说先上demo 其实demo是从官网下载的 只稍作改动 由于没有搞清楚怎么上传源代码 就把官网的链接贴出来吧 https://github.com/silviomoreto/bootstrap-select/archive/master.zip
其中改动的部分
其中,$("#maxOption2").selectpicker('val',['chicken','turkey','duck']);为设置多选值!
注意事项:1.此代码需写在页面的加载完成之后触发。
2.在实际用的时候jquery版本用最新的就可以了。我用的3.0
3.实际用的时候如果是动态赋值需要 $("#maxOption2").selectpicker('refresh');刷新。
其中改动的部分
<form class="form-horizontal" role="form"> <div class="form-group"> <label for="maxOption2" class="col-lg-2 control-label">multiple, show-menu-arrow, maxOptions=2</label> <div class="col-lg-10"> <select id="maxOption2" class="selectpicker show-menu-arrow form-control" multiple > <option value="chicken">chicken</option> <option value="turkey">turkey</option> <option value="duck">duck</option> <option value="goose">goose</option> </select> </div> </div> </form>
<script> document.addEventListener('DOMContentLoaded', function () { var mySelect = $('#first-disabled2'); $('#special').on('click', function () { mySelect.find('option:selected').prop('disabled', true); mySelect.selectpicker('refresh'); }); $('#special2').on('click', function () { mySelect.find('option:disabled').prop('disabled', false); mySelect.selectpicker('refresh'); }); $('#basic2').selectpicker({ liveSearch: true, maxOptions: 1 }); $("#maxOption2").selectpicker('val',['chicken','turkey','duck']); }); </script>
其中,$("#maxOption2").selectpicker('val',['chicken','turkey','duck']);为设置多选值!
注意事项:1.此代码需写在页面的加载完成之后触发。
2.在实际用的时候jquery版本用最新的就可以了。我用的3.0
3.实际用的时候如果是动态赋值需要 $("#maxOption2").selectpicker('refresh');刷新。
相关文章推荐
- Bootstrap-select 多选下拉框(官网的js地址错误)
- bootstrap-multiselect.js多选下拉框初始化时默认选中初始值
- js实现带有搜索框的可多选的动态下拉列表
- JS 获取select (多选下拉)中所选中的值
- js 获取select的值 / js动态给select赋值
- js控制select下拉框--动态隐藏,展示option
- bootstrap-select实现下拉框多选效果
- Bootstrap Multiselect 动态二联赋值 支持多选
- js:jquery multiSelect 多选下拉框实例
- 使用bootstrap-multiselect.js实现Input多选功能
- js:jquery multiSelect 多选下拉框实例
- JS操作select下拉框动态变动(创建/删除/获取)
- JS操作select下拉框动态变动
- html+js+PHP(使用了smarty模板技术)+mysql实现二级动态下拉列表(select)
- js 获取select的值 / js动态给select赋值
- bootstrap-select 多选下拉框使用教程
- JS 获取select (多选下拉)中所选中的值
- 给select下拉框赋值,js实现
- JS操作select下拉框动态变动(创建/删除/获取)