通过 class 隐藏特定 div 内的 bootstrap 元素

Question

我想通过以下 class 隐藏 bootstrap multiselect select all button：.multiselect-item.multiselect-all 位于特定的 div 中（class 由bootstrap 到 HTML Select）。目前我用 javascript 像这样隐藏它：

$('.multiselect-item.multiselect-all').addClass('hidden');

但是它所做的是在页面的任何地方隐藏该元素。我只想将它隐藏在指定的 div 中。我试过使用 .parent()、.find()、none，它们都有效。任何帮助深表感谢。我使用 bootstrap 多选。

我的HTML

<select id="typeCheckboxSelect" class="selectpicker" name="typeSelector[]" multiple="multiple">
   <option class='typeCheckbox' type='checkbox' value='test1'>Test One</option>
   <option class='typeCheckbox' type='checkbox' value='test2'>Test Two</option>
   <option class='typeCheckbox' type='checkbox' value='test3'>Test Three</option>
</select>

Answer 1

是否 Bootstrap 将 .multiselect-item.multiselect-all 添加到 select 元素？如果是这样，您只需将 div 的 class 添加到您的 jquery select 或使用特定 class 定位所有 div名字.

$('.selectpicker.multiselect-item.multiselect-all')

Answer 2

多个 select 插件实际上隐藏了您的原始 select 元素以及它自己的自定义元素。因此，要隐藏所需的项目，您需要修改 select 或多一点：

$('#typeCheckboxSelect ~ div ul li.multiselect-item.multiselect-all').addClass('hidden');

上面的 selector 将只针对创建为阴影的多个 select 框的 Select All 按钮#typeCheckboxSelect.

通过 class 隐藏特定 div 内的 bootstrap 元素

Hide bootstrap element by class that is inside a specific div

html

javascript

bootstrap-multiselect