話不多說先上demo 其實demo是從官網下載的 只稍作改動 由於沒有搞清楚怎么上傳源代碼 就把官網的鏈接貼出來吧 https://github.com/silviomoreto/bootstrap-select/archive/master.zip
其中改動的部分
<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');刷新。