Bootstrap selectpicker 下拉框多選獲取選中value和多選獲取文本值

1.頁面代碼：

頁面引入：

bootstrap-select.min.css和

bootstrap-select.min.js、

defaults-zh_CN.min.js文件，並初始化下拉選項框。

帶有下拉搜索樣式的下拉框屬性：data-live-search="true"

下拉選項框可多選屬性：multiple

<div class="col-xs-6 col-sm-6 col-md-4 col-lg-4 clearfix ">
    <label class="col-xs-4 col-sm-4 control-label required">車班名稱：</label>
    <div class="col-xs-8 col-sm-8">
        <div class="input-group">
            <select name="shuttleBusId" class="form-control select-picker" data-live-search="true" multiple>
                <option value="">-- 請選擇 --</option>
                <option th:each="iterator : ${vehicleShiftList}"
                        th:value="${iterator.idTrafficVehicleShift}"
                        th:text="${iterator.vehicleShiftName}">
                </option>
            </select>
        </div>
    </div>
</div>

 

2.js代碼// select 多選可以設置做多選中項，使用maxlength

// js代碼如下： // 獲取到下拉框說所有選中項
var checkParam = $('#type-select').find('option:selected'); // 選中的ID集合
var checkId = []; // 選中的文本值集合
var checkText = []; for (var i=0;i<checkParam.length;i++) { checkId.push(checkParam[i].value); } for (var i=0;i<checkParam.length;i++) { checkText.push(checkParam[i].textContent); } // 數組轉字符串
var ids = checkId.join(','); var text = checkText.join(',');
// 1.定義對象，並設置屬性名和值--------------------------------------------- // 判斷是否選中
if (checkParam.length > 0) {
　　　var hilidayFlag = 1; // 定義傳入參數對象，並賦值
    var params = { holidayFlag: holidayFlag, shuttleBusId: ids,
　　　　 shuttleBusName: text } }

// 2.定義對象，並設置屬性名和值---------------------------------------------

// 獲取表單值
var user= {};
// 獲取到頁面表單中所有值 name-value形式
var formData = $('#addForm').serializeArray();
formData.forEach(function (item) {
    user[item.name] = item.value;
})

ps:將獲取表單結果數組轉成對象