当前位置: 首页 > 面试题库 >

当用户在DIV之外单击时,使用jQuery隐藏DIV

晋坚
2023-03-14
问题内容

我正在使用此代码:

$('body').click(function() {
   $('.form_wrapper').hide();
});

$('.form_wrapper').click(function(event){
   event.stopPropagation();
});

和这个 HTML

<div class="form_wrapper">
   <a class="agree" href="javascript:;">I Agree</a>
   <a class="disagree" href="javascript:;">Disagree</a>
</div>

问题是我的链接位于内,div单击时它们不再起作用。


问题答案:

遇到同样的问题,想出了这个简单的解决方案。它甚至可以递归工作:

$(document).mouseup(function(e) 
{
    var container = $("YOUR CONTAINER SELECTOR");

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


 类似资料:
  • 我使用jQueryUI菜单作为上下文菜单,因此当用户单击表中的单元格时,它会显示相关选项。问题是,它不是真的被设计成这样使用的,所以当用户点击菜单外时它不会隐藏。 我尝试使用模糊方法: 由于某种原因,即使您滚动到菜单中的一个选项上,菜单也会隐藏。 有没有简单的解决办法? 编辑:要拉起我使用的菜单: 如果我尝试使用$('body'),它似乎总是首先被调用。单击()将其隐藏。您可以更改jQuery处理

  • 问题内容: 我有一个菜单和三个隐藏的div,这些div取决于用户选择的选项。我只想使用CSS来显示/隐藏它们。我现在正在使用jquery,但我希望禁用js即可访问它。此处有人为其他人提供了此代码,但仅在div:hover或div:active时有效,当我将其更改为div:visited时它不起作用。我是否需要添加某些内容,或者这不是正确的方法?感谢您的帮助:) 问题是我的客户希望菜单被选中时此di

  • 问题内容: 如果不使用JQuery,这可能吗? 它用于移动网站,但是页面始终处于脱机状态,所以我真的不想使用jquery。与自定义CSS样式相比,为jquery mobile提供自定义样式要困难得多。 问题答案: 使用和输入 使所选项目保持打开状态并切换。 使用和命名输入 与复选框类似,它仅关闭已打开的复选框。在两个输入上 使用。 使用和 与输入类似,您还可以使用键触发状态。 在手风琴外部单击将关

  • 问题内容: 这是该问题的后续问题:具有焦点的AngularJS输入会杀死list的ng-repeat过滤器 基本上,我的代码是使用AngularJS在右侧弹出一个div(抽屉)以过滤事物列表。大多数情况下使用此功能时,UI会被阻止,因此单击该阻止div会关闭抽屉。但是在某些情况下,我们不会阻止用户界面,需要允许用户在抽屉外部单击以取消搜索或选择页面上的其他内容。 我最初的想法是在抽屉打开时附加一个

  • 问题内容: 我正在尝试使用复选框和过滤器选项创建多选下拉列表。我试图隐藏列表,但我在外面单击却无法弄清楚。感谢你的帮助。 http://plnkr.co/edit/tw0hLz68O8ueWj7uZ78c 问题答案: 请注意,打开第二个弹出窗口(在具有多个选择的页面上)时,您的解决方案(问题中提供的Plunker)不会关闭其他框的弹出窗口。 通过单击一个框打开一个新的弹出窗口,单击事件将始终停止。

  • 问题内容: 我正在使用Angular.js应用程序,该应用程序通过医疗程序的json文件进行过滤。当使用ng- click单击(在同一页面上)过程名称时,我想显示每个过程的详细信息。这是我到目前为止的内容,.procedure-details div设置为显示:无: 我在角度上很新。有什么建议? 问题答案: 删除,然后改用: 这是小提琴:http : //jsfiddle.net/asmKj/ 您