Question

我使用的是非常酷的Bootstrap Dropdown-checkbox，但它在列表上方有一个按钮，用于下拉列表，我希望保持列表的下拉状态。它与我见过的其他CheckBoxList控件相比毫不逊色。

它呈现的HTML基本上是隐藏的列表：

<div id="agency-suburbs-list" class="suburbDropdownCheckbox dropdown-checkbox dropdown">
    <button class="dropdown-checkbox-toggle" data-toggle="dropdown" href="#" aria-expanded="false">Suburbs List</button>
    <div class="dropdown-checkbox-content">
        <ul class="dropdown-checkbox-menu">
            <li>
                <div class="layout">
                    <input type="checkbox" id="247908647965.94836"><label for="247908647965.94836">Alberante</label>
                </div>
            </li>
            ...
            <li>
                <div class="layout">
                    <input type="checkbox" id="882857971221.6206"><label for="882857971221.6206">Alrode</label>
                </div>
            </li>
        </ul>
    </div>
</div>

将HTML与下拉时呈现的内容进行比较，唯一的区别是外部div有一个额外的open类。控件的网页上显示的API显示没有JS功能可以打开或关闭它，我手动应用该类不会打开下拉列表;

$("#me-open").click(function(e) {
        $("#agency-suburbs-list").addClass("open");
    });

其中me-open只是一个额外的按钮，与我为测试添加的控件无关。关于此控件的其他所有内容似乎都运行正常，所以我想保留它，当用户从select中选择一个值时，该列表应该填充，然后还必须单击另一个按钮才能看到所选的价值观是一个非常糟糕的因素。

Answer 1

该下拉框是一个bootstrap模式。按下按钮时会触发它。

如果你想一直显示它，你需要添加一些像这样的CSS：

.dropdown-checkbox-content {
    display: block!important; /* or inline-block */
    position: static!important;
}

如果要隐藏切换按钮：

dropdown-checkbox-toggle {
    display: none;
}

如何保持Bootstrap下拉复选框列表下降

1 个答案: