javascript - bootstrap-select 不适用于狭窄的领域

Question

我正在使用 bootstrap-select.js增强移动网站。

在我遇到问题的页面上，我已经成功地使用插件来设置字段样式，如下所示:

<div>
    <h:selectOneMenu value="#{bean.paymentChoices}" styleClass="selectpicker">
        <f:selectItem itemValue="#{null}" itemLabel="Select an Option" />
        <f:selectItems value="#{bea.paymentChoiceItems}" var="selectItem" itemLabel="#{selectItem.label}" itemValue="#{selectItem.value}" />
    </h:selectOneMenu>
</div>

我用来套用selectpicker样式的JS如下:

$(".selectpicker").selectpicker('mobile);

但是，我有 3 个菜单也有 selectpicker 类，但是它们的宽度设置为屏幕宽度的 30% - theJS 无法在它们上设置 selectpicker 样式。

有人知道为什么会这样吗？

Answer 1

发现(并解决了!)的问题:

正如我在问题中提到的那样，我将宽度设置为 30%。

我添加了一些媒体查询来检查屏幕宽度，并相应地设置下拉宽度，不使用百分比，例如宽度:npx；不是宽度:30%