twitter-bootstrap - 当前一个关闭时打开另一个引导选择（selectpicker）

Question

我的页面上有 2 个选择器。当用户在第一个中选择某些内容时，我希望能够打开（向下滑动）第二个选择器。这样做是为了帮助用户不要点击太多。

示例 HTML：

<div class="row">
    <select class="select-picker" id="picker1" data-size="10">
        <option>Opt 1</option>
        <option>Opt 2</option>
        <option>Opt 3</option>
        <option>Opt 4</option>
    </select>

    <select class="select-picker" id="picker2" data-size="10">
        <option>Opt 2.1</option>
        <option>Opt 2.2</option>
        <option>Opt 2.3</option>
        <option>Opt 2.4</option>
    </select>
</div>

JS 示例：

$(document).ready(function() {
    $('.select-picker').selectpicker();

    $('.select-picker').change(function(){
        // Trying to open 2nd selectpicker
        $selectpickerButton = $('button[data-id="picker2"]');
        $selectpicker = $selectpickerButton.parent();

       //$selectpicker.addClass('open');
        $selectpickerButton.click();
    });
});

这是 JSBin：http: //jsbin.com/UFoRIYex/514/edit

和小提琴：http: //jsfiddle.net/u6vWL/46/

Answer 1

以下工作，它有点脏，但是嘿！

更新的答案

我使用了与以前相同的答案，但现在我设置了一个超时并在超时完成后调用一个函数：

    $('.select-picker').selectpicker();
var selectpickerButton = $('button[data-id="picker2"]');


$(document).on("change", "#picker1", function () {
    setTimeout(function () {
        // Do something after xx milli seconds
        youSelected();
    }, 100);
});

function youSelected() {
    $(selectpickerButton).trigger('click');

}

jsfiddle