3

我遇到了有关键盘事件的问题，例如keydown事件。该应用程序是一个完全使用 JavaScript 和 DOM 操作构建的单页 web 应用程序。

所有键盘处理都由添加到使用文档的单个处理程序处理。

document.addEventListener("keydown", handler, true);

然后该处理程序解码键盘事件并将内部键码委托给应用程序框架。

DOM 树仅由 DIV 元素和文本节点组成。

现在，当添加带有外部 HTML 文档的 iframe 并且它包含可以接收焦点的元素时，会绕过原始处理程序。将关键事件流恢复到原始处理程序的唯一方法是将焦点设置到主文档。

所以看起来 iframe 添加的新文档绕过了原始文档中的捕获/冒泡事件链。

这已经在 chrome 中进行了测试以供参考，但实际应用程序运行在机顶盒中的嵌入式 Web 浏览器上，该 Web 浏览器基于 Webkit。

在机顶盒中没有鼠标界面，因此唯一的输入是来自遥控器的按键事件。这给我们带来了一个问题，因为我们不想在使用 iframe 加载其他页面时放松对关键事件的控制。

使用事件处理程序进行 DOM 操作并检测何时添加 iframe 并将主键事件处理程序添加到新插入的文档的唯一解决方案是？或者是否有一种方法可以确保键事件处理程序始终接收浏览器窗口中的所有键事件。

编辑

我刚刚意识到可以将事件处理程序添加到窗口对象中，我也会尝试一下。

编辑

将键事件处理程序添加到窗口对象并没有改变任何东西。

4

1 回答 1

1

通过使用以下解决方法解决：

    document.addEventListener("DOMNodeInserted", function (event) {
        if(event.type === "DOMNodeInserted") {
            if(event.srcElement.nodeName === "IFRAME") {
                event.srcElement.addEventListener("keypress", function(kevent) {
                    document.dispatchEvent(kevent);
                    }, true);
             }
         }
    },true);

这会在捕获阶段将关键事件从子 iframe 传播到主文档。

于 2010-11-04T11:34:39.957 回答