将样式 input-sm 应用于 bootstrap-select 插件完全改变控件的外观

Question

我正在使用 Bootstrap 和 Laravel 开发一个网站，到目前为止，一切看起来都还不错。但是，我已经开始使用此处找到的 bootstrap-select 插件并偶然发现了一个恼人的错误：

http://silviomoreto.github.io/bootstrap-select/

在document.ready函数中，我有以下代码来稍微降低控件的高度：

$("#myControl").selectpicker(
{style: "input-sm"});

不知何故，这完全改变了 select 框的外观。整个控件变成深灰色，完全没有边框（或者边框仍然存在，并且与控件的背景融为一体），而不是让控件变成带有浅灰色边框的白色（如您在网站上看到的那样）。

有人遇到过这个错误吗？

Answer 1

select选择器插件使用 bootstrap 按钮创建下拉菜单，而不是 select，因此请使用适当的按钮样式，例如 btn-sm:

$("#myControl").selectpicker({
    style: "btn-sm"
});

Answer 2

感谢 Ted，感谢你，我才能够弄清楚我做错了什么。你是对的，我用错了风格。但是，要使事情正常工作还需要一个额外的怪癖：

$("#myControl").selectpicker({
    style: "btn-default btn-sm"
});

是的，btn-default 用于所需的外观，btn-sm 用于所需的尺寸。将这两者结合起来，事情就会完美。

谢谢:)

Answer 3

如果右击查看页面源码，这可不是简单的select。我从互联网上使用了类似的东西

<div class="form-group form-group-sm">                                       
<select class="form-control selectpicker" id="aaaaaa" data-live-search="true">
<option value="1">x1</option>
<option value="2">x2</option>
<option value="3">x3</option>
</select>
</div>

注意表单组中的 form-group-sm 而不是表单控件中的 input-sm。

将样式 input-sm 应用于 bootstrap-select 插件完全改变控件的外观

Applying style input-sm to bootstrap-select plugin completely changes control's appearance

php

plugins

select

twitter-bootstrap