【问题标题】:Use jQuery to hide DIV when click outside it, but allow propagation of events在 DIV 外部单击时使用 jQuery 隐藏 DIV,但允许传播事件
【发布时间】:2011-08-31 23:05:32
【问题描述】:

我已经阅读了很多其他问题,这些问题涉及当您在 div 外部单击时如何关闭它,但我遇到了一个复杂的问题,因为我还有其他与 .live() 绑定的元素

我想要发生的是,如果我点击页面上的其他任何地方,div 应该消失,包括如果我点击一个“活动”元素。当我单击该实时元素时,我希望它的处理程序正常进行。

据我所知,处理关闭 div 的基本方法是将点击侦听器附加到或 $document,但这会阻止任何其他实时事件冒泡通过上述 body/doc 处理程序。有没有解决的办法?

【问题讨论】:

  • 这个网站对 live() 的工作原理进行了方便的解释:bennadel.com/blog/…
  • 也许这会有所帮助:api.jquery.com/event.target
  • 我没有真正看到你的问题,因为你只需要不从关闭 div 的方法返回 false/调用 stopPropagation。
  • 返回 false/stopPropagation 不是我需要的。我需要相反的情况,在我使用 body.click() 函数检查事件后,我希望任何 live() 调用继续传播。是否有等效的“continuePropagation”功能?

标签: jquery event-propagation


【解决方案1】:

在直播中,事件按照从最前面到最后面的顺序在阶梯上冒泡。在您的“活动”元素的单击(这是您的身体对象的直接/间接子对象)中,如果您不返回 false 或停止传播,它将冒泡到达文档的单击处理程序。通过 live 附加文档的点击似乎不起作用。

在此处查看示例实现:http://jsfiddle.net/VHtSP/6/

$('div.menu').live('click', function(e) {
    e.stopPropagation();
    alert('click inside menu. will not propagate.');
    return false;
});

$(document).click(function() {
    alert('document click() handler.');
    // close the div
    $('div.menu').hide();
});

$('a').live('click', function() {
    alert('<a> click() handler');
    // .. your code to handle the live element's click
});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2011-09-20
    • 2012-07-17
    • 1970-01-01
    • 2012-12-26
    • 1970-01-01
    • 1970-01-01
    • 2014-06-09
    相关资源
    最近更新 更多