Flat-ui 选择下拉菜单不起作用答案

【问题标题】：Flat-ui select dropdown is not functioningFlat-ui 选择下拉菜单不起作用
【发布时间】：2015-02-26 12:37:32
【问题描述】：

我正在使用 Flat-UI (http://designmodo.github.io/Flat-UI/) 来帮助我正在构建的一个小型 MeteorJS 应用程序的前端元素。

我遇到的问题是 Select Dropdown 不起作用。我想知道如何获得期权价值。请参阅以下标记：

<div class="select2-container form-control select select-primary" id="s2id_autogen1">
    <a href="javascript:void(0)" class="select2-choice" tabindex="-1">   
        <span class="select2-chosen" id="select2-chosen-2">My Profile</span>
        <abbr class="select2-search-choice-close"></abbr>   
        <span class="select2-arrow" role="presentation">
            <b role="presentation"></b>
        </span>
    </a>
    <label for="s2id_autogen2" class="select2-offscreen"></label>
    <input class="select2-focusser select2-offscreen" type="text" aria-haspopup="true" role="button" aria-labelledby="select2-chosen-2" id="s2id_autogen2">
</div>
<select class="form-control select select-primary" data-toggle="select" tabindex="-1" title="" style="display: none;">
    <optgroup label="Profile">
        <option value="0">My Profile</option>
        <option value="1">My Friends</option>
    </optgroup>
    <optgroup label="System">
        <option value="2">Messages</option>
        <option value="3">My Settings</option>
        <option value="4">Logout</option>
    </optgroup>
</select>

这就是我们在 flatui 文档中的内容。但是选择下拉菜单不起作用，有人可以帮我让它工作并从选项中提取价值吗？

【问题讨论】：

标签： html twitter-bootstrap user-interface markup flat

【解决方案1】：

由于无法设置系统样式，我们进行了自定义选择。它基于 Select2 插件，对源代码稍作修改以满足 Bootstrap 命名约定。

选择2 3.5.2

检查这个： http://select2.github.io/select2/

$("#selectList")
.on("change", function(e) { log("change "+JSON.stringify({val:e.val, added:e.added, removed:e.removed})); })

【讨论】：

【解决方案2】：

如果您仔细阅读文档，您会注意到您手动添加了一个 select2 调用来转换所有选择。

例如像这样：

$( document ).ready(function() {
  $("select").select2({dropdownCssClass: 'dropdown-inverse'});
});

【讨论】：