Question

我正在使用Bootstrap Select插件。

<div class="form-group col-md-6">
    <select class="selectpicker form-control" id="veicoli" data-style="btn-transparent" data-title="Veicoli" data-selected-text-format="static" data-live-search="true" multiple>
        <option value="1">EA018YE</option>
        <option value="11">FM088KP</option>
        <option value="17">DT590LW</option>
        <option value="21">DB814RZ</option>
        <option value="33">DM408DG</option>
        <option value="40">EH942GJ</option>
    </select>
</div>

我使用以下方式以编程方式选择选项：

$(document).ready(function() {
  $('#veicoli').selectpicker('val', data);
  $('#veicoli').selectpicker('refresh');
}

其中data是一个数组：

["11", "33"]

上面的代码正确地选择了bootstrap-select中的选项，但是触发事件changed.bs.select是我这样定义的：

$(document).on('changed.bs.select', '#modale-dettagli #veicoli', function(e, clickedIndex, isSelected, previousValue) {
  console.log('e: ' + e);
  console.log('clickedIndex: ' + clickedIndex);
  console.log('isSelected: ' + isSelected);
  console.log('previousValue: ' + previousValue);
}

无法正常工作，因为clickedIndex是undefined

这是上面事件的输出：

e: [object Object]
clickedIndex: undefined
isSelected: undefined
previousValue: undefined

请注意，当单击相同的选项（使用鼠标）时，相同的事件将正常工作

编辑：据您了解，我现在遇到的问题是早期版本val() method doesn't fire changed.bs.select

中的错误

编辑2：我发现我可以使用this.selectedIndex（而不是使用函数参数clickedIndex）和一些“代码”来获取所选选项的索引技巧”可以完成工作

Answer 1

clickedIndex仅在触发点击事件时（手动选择选项时）才返回。文档可能应该进行更新以反映这一点，但是使用val()方法时，很难正确实现，因为在多选的情况下，可以一次更改多个值（因此很难确定哪些元素将被视为“点击”）。但是，应该返回previousValue ，但事实并非如此。不过，该问题将在引导选择v1.13.9中修复（https://github.com/snapappointments/bootstrap-select/issues/2244）。

Bootstrap select不会在changed.bs.select上返回clickedIndex

1 个答案: