将 select2 插入 Bootstrap 下拉菜单答案

【问题标题】：Insert select2 into Bootstrap dropdown将 select2 插入 Bootstrap 下拉菜单
【发布时间】：2013-01-16 09:59:02
【问题描述】：

我在尝试将 select2 从 Bootstrap 插入 dropdown-menu 时遇到问题。标记是这样的：

<ul class="dropdown-menu dropdown-select-box">
    <li>
        Choose categories:
        <select id="choose-category" multiple="">
            <option></option>
            <option></option>
            <option></option>
        </select>
    </li>
</ul>

我的 .dropdown-select-box 类，用于样式设置和更好的控制。我似乎无法让它发挥作用，这让我发疯并浪费了我宝贵的时间。这是我希望通过此实现的结果：

这意味着 select2-container 需要始终打开并且（以某种方式）相对于下拉菜单定位，以便下拉菜单可以缩放到 select2-container 的大小。我试图把我的想法包裹起来，但空手而归。

【问题讨论】：

标签： twitter-bootstrap drop-down-menu jquery-select2

【解决方案1】：

我认为引导下拉 js 和选择插件 js 相互冲突...

尝试删除引导下拉 js 并运行代码...

    <script src="assets/js/jquery.js"></script>
    <script src="assets/js/bootstrap-transition.js"></script>
    <script src="assets/js/bootstrap-alert.js"></script>
    <script src="assets/js/bootstrap-modal.js"></script>
    <script src="assets/js/bootstrap-dropdown.js"></script> //Remove this...
    <script src="assets/js/bootstrap-scrollspy.js"></script>
    <script src="assets/js/bootstrap-tab.js"></script>
    <script src="assets/js/bootstrap-tooltip.js"></script>
    <script src="assets/js/bootstrap-popover.js"></script>
    <script src="assets/js/bootstrap-button.js"></script>
    <script src="assets/js/bootstrap-collapse.js"></script>
    <script src="assets/js/bootstrap-carousel.js"></script>
    <script src="assets/js/bootstrap-typeahead.js"></script>
    <script src="assets/js/bootstrap-affix.js"></script>

从你的模板中删除所有无用的js...

【讨论】：