如何仅隐藏指定div内的Bootstrap Multiselect全选按钮？

这问题我之前也碰到过！核心问题大概率是Bootstrap Multiselect的下拉菜单是动态生成的，而且默认会挂载到body标签下，并不是在你指定的div内部，所以直接用.find()或者简单的后代选择器肯定找不到目标元素。给你两种针对性的解决方案：

情况1：下拉菜单确实在指定Div内部（少见但存在） #

如果你的Multiselect配置把下拉菜单放在了原select所在的div内，直接用精准的后代选择器就能搞定：

// 假设你的指定div有ID "target-container"
$('#target-container .multiselect-item.multiselect-all').addClass('hidden');

// 或者用find写法效果一样
$('#target-container').find('.multiselect-item.multiselect-all').addClass('hidden');

情况2：下拉菜单动态挂载到外部（默认行为） #

这是最常见的场景，下拉菜单被生成到body里，和原div不在同一DOM层级。这时候需要通过原select元素关联到对应的Multiselect实例，再定位全选按钮：

$(document).ready(function() {
  // 先初始化你的Multiselect
  $('#target-container select').multiselect();

  // 1. 定位指定div内的select元素
  const $targetSelect = $('#target-container').find('select');
  // 2. 获取该select绑定的Multiselect实例
  const multiselectInstance = $targetSelect.data('multiselect');
  
  // 3. 从实例中拿到下拉菜单容器，隐藏全选按钮
  if (multiselectInstance) {
    multiselectInstance.$dropdown.find('.multiselect-item.multiselect-all').addClass('hidden');
  }
});

关键说明： #

• 一定要确保代码在Multiselect初始化完成后执行，否则data('multiselect')拿不到实例。
• 如果你的页面有多个Multiselect，这种方式只会影响指定div内的那个，不会全局隐藏。

内容的提问来源于stack exchange，提问作者CrimzonWeb