如何使 bootstrap-multiselect 不可见我的默认值？

我正在使用引导多选插件使处理下拉菜单更容易。但是，我在尝试默认隐藏菜单时遇到了问题。

基本上，我有一个复选框，当选中此复选框时，我会显示下拉菜单。当取消选中它时，菜单应该隐藏。默认情况下该复选框未选中，因此我希望默认情况下也隐藏菜单。

我尝试使用基本的 css 代码隐藏菜单到我的选择菜单，如下所示：

<select name="menu" id="related_calls_menu" style="display: none;" multiple="multiple">....</select>

但这似乎被引导多选中的某些内容所覆盖。如果我删除插件，显示/隐藏功能可以正常工作，没有问题。

这是我当前的菜单代码

    $(function(){

        $("#related_calls_menu").multiselect({
            enableFiltering: true,
            enableCaseInsensitiveFiltering: true,
            selectedClass: null,
            selectAllText: 'Select All',
            includeSelectAllOption: true,
            nonSelectedText: 'Select Related Account(s)',
            buttonWidth: '300px'
         });

        $(window).load(function(){
            $("#related_calls_menu").hide();
        });

        $('#complete_related_calls').click(function(){

            if( $(this).is(':checked') )
                $("#related_calls_menu").show();
            else
                $("#related_calls_menu").hide();
        });
    });

我尝试过添加.css('visability: hidden; display:none;');到 $("#related_calls_menu")

我也尝试过添加这段代码

    $(window).on('load', function(){
        $("#related_calls_menu").hide();
    });

没有什么真正起作用，我似乎无法隐藏菜单。另外，当我单击复选框显示菜​​单时，我会看到第二个菜单，它没有插件外观。

这是复选框之前的屏幕截图

这是复选框后的屏幕截图

请指教。

Select 标签已被 bootstrap 隐藏。

像这样在你的选择标签周围放置一个包装 div

<div id="mywrapper">
  <select name="menu" id="related_calls_menu" style="display: none;" multiple="multiple">....                    </select>
</div>

然后你可以像这样控制包装div：

CSS:

#mywrapper{
display:none;
}

jQuery

$("#mywrapper").show();
$("#mywrapper").hide();