jquery - 未调用 Twitter Bootstrap SelectPicker onchange 函数

Question

所以我有一个简单的选择列表

<select id="themes" class="selectpicker">
    <option selected>mkl-ambiance</option>
    <option>default</option>
    <option>ambiance</option>
    <option>blackboard</option>
</select>

和一小段jquery

   $("#themes").change(function() {
        var theme = $("#themes").val();
        editor.setOption("theme", theme);
    });

如果我class="selectpicker"从选择中删除，则回调按预期工作。我什至添加onchange="doMyFunction并更改$("#themes").change(function() {为 function doMyFunction() {，但仍然没有用。我是否缺少一些引导魔法来使其正常工作？

Answer 1

这是因为 Selectpicker 生成<ul>并<li>标记并保留<select>and<option>放在一边。它为每个元素添加了 'rel' 属性，<li>以便您了解相对于 selected 选择了哪个选项<li>。

无论如何，您应该使用 Selectpicker 插件中的官方 onChange 事件，或者执行以下操作：

$('ul.dropdown-menu.selectpicker li').on('click', function () {
    var selectedValue = $($('select.selectpicker option')[$(this).attr('rel')]).val();
});