Question

我将一个面板放在一个引导程序下拉列表中，但当我在面板内部单击时，下拉列表就会消失。我在stackoverflow上有很多解决方案，但它对我没用。当我点击内部时，如何防止面板消失。enter code here

   <span class="input-group-addon dropdown">
      <label class="dropdown-toggle " id="dropdownMenu1" data-toggle="dropdown aria-expanded="false">Advanced Search  <span class="caret"></span></label>
      <div class="panel panel-default panel-body dropdown-menu " role="menu"" aria-labelledby="dropdownMenu1" style="width:860px; margin-left:-700px">
        Panel content
      </div>
   </span>

Answer 1

尝试执行以下操作：如果单击正文，则会检查父类，如果单击下拉列表，如果父级具有类.dropdown-parentclass，则下拉列表不会关闭。

$('body').click(function(event){
    if ($(event.target).parent('.dropdown-parentclass').size()>0) {
        return false;
    }
});

Answer 2

尝试使用以下代码。只有当您单击容器旁边时，它才会关闭下拉列表。

      $(document).on("mouseup", function (e) {
        var container = $(".panel");

        if (!container.is(e.target) // if the target of the click isn't the container
            && container.has(e.target).length === 0) // nor a descendant of the container
        {
            container.hide();
        }
        else {

        }
    });

如果在内部单击，则不应关闭下拉菜单

2 个答案: