jquery focusin() 和防止冒泡

Question

更新 2：

我睡在上面，然后编写了一些示例代码来尝试进一步找出问题所在。

这是一个使用 firebug 的 console.log 的示例，向您展示哪个对象触发了 focusin 事件：

http://jsbin.com/axefo3/11

1) 点击第一个链接：黄色 div 显示 2）点击tab键：它应该进入黄色div内的链接

它这样做了，但随后它触发了 focusin 事件，并且由于某种原因，它似乎再次冒泡到红色 div，然后被告知关闭黄色 div。

即使在我告诉黄色 div 不传播焦点事件之后也是如此：

$('#innerDiv').focusin(function(e){e.stopPropagation()});

然后我尝试仅在我关注内部 div 之后将 focusin 事件附加到父 div 上。

http://jsbin.com/axefo3/16

发生的情况是，在内部 div 中的第一个链接上切换确实会在父 div 上设置 focusin 事件。这很好！但是，然后在 innerdiv 中跳到下一个链接会再次冒泡 focusin 事件，从而关闭 div。

所以，我想我还是被难住了。看来我无法阻止专注于冒泡。想法？理论？

下面是原帖...

=============================

我通过 onclick 事件显示一个 div。如果您单击 div 外部，我想隐藏它。为此，我在正文上绑定了一次单击事件：

$('body').one('click.myDivPopup', function(e) {
    ...close my div...
});  

在 div 本身中，我告诉它不要传播事件，以便在 div 中实际单击不会触发对主体的单击：

$myDiv.click(function(e){e.stopPropagation()});

这可以正常工作。

如果 div 中有一个标签，我也想隐藏 div。

我的想法是，在那种情况下，我可以在 body 上使用 focusin 事件：

$('body').one('focusin.myDivPopup', function(e) {
    ...close my div...
}); 

再次，我不希望事件从 div 本身中冒出来，所以添加了这个：

$myDiv.focusin(function(e){e.preventDefault()});

这不起作用。在 myDiv 中更改元素内的焦点会触发 body 上的 focusin 事件。

这可能是 jQuery 中的错误吗？如果是这样，有没有更好的方法来实现这一点？

更新：

问题似乎是似乎无法确定 DIV 是否失去焦点，因为它永远无法获得焦点。我的解决方案逻辑是查看 ELSE 的焦点是否在 div 之外（因此使用 focusin），但我遇到了 div 中的 focusin 事件似乎通过在身体上触发而冒泡的问题。

目前，我认为我的解决方案是在弹出窗口中添加一个 CLOSE 元素，然后让人们明确触发它。但并不理想，尤其是对于键盘导航。

Answer 1

显示 2 个 div 不是更容易吗？一个覆盖整个页面的透明（不可见）div 和您真正想要显示的另一个。那么你只需要设置z-index正确的body

然后为不可见的 div 注册单击事件，并在单击时将两者都删除。完成的。至少这是大多数人的方式，例如我猜模态对话框 jquery 插件可以工作

演示http://jsbin.com/uzoyo/3

Answer 2

如果你想使用focusin但不使用事件冒泡，为什么不直接使用focus...？