引导选择显示错误

我正在使用Silvio Moreto's BootStrap library，它没有正确显示选择。引导选择显示错误

这是一个screen shot的问题。

我的猜测是我做错了什么。我不知道是什么导致了这个问题，但我检查了我的JavaScript加载顺序，这似乎很好。

下面是我执行代码的html。

<select name="action_type" class='selectpicker'> 
    <option value="phone">call</option> 
    <option value="email">email</option> 
    <option value="url">open to url</option> 
</select>

这是selectpicker（）执行后的扩展形式。

<div class="btn-group bootstrap-select"> 
    <button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown"> 
    <div class="filter-option pull-left">call</div>&nbsp; 
    <div class="caret"></div></button><div class="dropdown-menu open"> 
    <ul class="dropdown-menu inner" role="menu"> 
     <li rel="0" class="selected"><a tabindex="0" class="" style=""><span class="text">call</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li> 
     <li rel="1"><a tabindex="0" class="" style=""><span class="text">email</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li> 
     <li rel="2"><a tabindex="0" class="" style=""><span class="text">open to url</span><i class="glyphicon glyphicon-ok icon-ok check-mark"></i></a></li> 
    </ul> 
    </div> 
</div>

任何人有任何想法是怎么回事？我认为它可能是CSS。

更新::

我只用引导框架的某些部分，因为有很多的，我不需要。我使用按钮，表单和下拉js/css的版本2.3.2，但由于某些原因，它不足以用于引导选择器。

以下是仅使用test file的bootstrap 3.0源代码的图片。

谢谢！

来源

2013-10-15 cj3kim

您可以发布您完整的HTML的一个最小的例子吗？你加载的JavaScript以及CSS？ – Thomas

是的，我加载。我相信它的依赖是引导下拉js和css。 – cj3kim

我不使用整个twitter引导框架，只下载我需要的东西。到目前为止，我只使用button.js/css form.js/css和dropdown.js。我还包括bootstrap-select.js/css – cj3kim

您是否初始化了jQuery libray并告知它将哪些元素应用于更改？

从库文件...

$('.selectpicker').selectpicker();

你需要做这个的document.ready

来源

2013-10-15 21:07:28 Gavin

是的，我在我的骨干视图中这样做。谢谢！ – cj3kim

引导选择显示错误

回答

相关问题