0

更新 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 元素,然后让人们必须明确地触发它。但并不理想,尤其是对于键盘导航。

4

2 回答 2

0

如果您想使用 focusin 但不使用事件冒泡,为什么不使用focus...?

于 2010-06-10T14:22:34.593 回答
0

显示2个div不是更容易吗?一个覆盖整个页面的透明(不可见)div 和您真正想要显示的另一个。然后你只需要设置z-index正确的body < invisblediv < contentdiv。

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

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

于 2010-03-16T22:02:28.520 回答