Javascript 页面加载时未显示引导选择

Javascript 页面加载时未显示引导选择,javascript,twitter-bootstrap,bootstrap-select,Javascript,Twitter Bootstrap,Bootstrap Select,我正在尝试进行一个简单的引导选择显示。但它没有出现 在查看调试器时,我看到以下行上的显示为“无”: select.bs-select-hidden, select.selectpicker { display: none !important; } 关键是我从来没有把这个类添加到我的select中。并且不希望在调试器样式窗口中看到它。我想这就是原因 下面是简单的代码: <div class="input-group input-group-sm">

我正在尝试进行一个简单的引导选择显示。但它没有出现

在查看调试器时,我看到以下行上的显示为“无”:

select.bs-select-hidden, select.selectpicker {
    display: none !important;
}
关键是我从来没有把这个类添加到我的select中。并且不希望在调试器样式窗口中看到它。我想这就是原因

下面是简单的代码:

<div class="input-group input-group-sm">                    
    <select class="selectpicker" id="event-name-ecom">
              <option value="addToCart" selected>Add To Cart</option>
              <option value="checkout">Checkout</option>
              <option value="removeFromCart">Remove From Cart</option>
              <option value="review" >Review</option>
              <option value="payment" >Payment</option>
              <option value="confirmation" >Confirmation Page</option>
    </select>
    <p class="bg-danger" id="event-required-ecom" style="margin-right: 25px; display: none"></p>
</div>

添加到购物车
结账
从购物车上取下
复习
付款
确认页


有什么想法吗?

即使是我也面临类似的问题,但找不到这种行为的原因。 初始化引导选择显式地为我工作。
只要在dom准备好后执行
(“.selectpicker”).selectpicker()
这可能太晚了,答案对原始海报没有用处。但是,如果其他人有这个问题,我可以通过显式地将
.selectpicker('render')
添加到我的代码中来修复它:

$(".selectpicker").selectpicker({
    "title": "Select Options"        
}).selectpicker("render");
使用
$(.selectpicker”).selectpicker(“刷新”)加载DOM后

$(document).ready(function() {
    $(".selectpicker").selectpicker("refresh");
});

此类位于bootstrap-select.css文件中,该文件用于设置selectpicker控件的样式

看起来selectpicker初始化代码没有自动拾取控件,因为您应该具有隐藏的select,后跟一个按钮和一个包含所有selectpicker数据的div。当控件在初始加载后添加到页面时,可能会发生这种情况。发生这种情况时,您应该继续运行此javascript以初始化选择器选择器:

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

好的,我发现了一些关于引导选择与React的工作方式。 当选择选项取决于某个反应状态时,您希望调用:

$('.selectpicker')。selectpicker('refresh');
更新状态之后


希望这对您有所帮助,原因可能是您动态呈现了html代码(即html是在加载页面后添加的)。当我使用ajax向完全加载的页面呈现一些html时,我遇到了这个问题


解决方案是添加
$('.selectpicker').selectpicker()

代码中没有描述的问题,即使是
重要的
规则也不会导致任何问题。您可能忘记了包含
bootstrap select.js
bootstrap select.css