删除 iframe 后窗口事件丢失

Question

我遇到了一个问题，即表单嵌入到 iframe 中，并且在提交表单后，iframe 会从 DOM 中删除。删除表单后（表单是最后一个焦点），我无法检测到绑定到根窗口元素的事件。

框架是从一个单独的域加载的，尽管对于这个例子来说这无关紧要，重要的是我无法控制那个页面上的脚本。

我了解我无法检测 iframe 中的 DOM 事件，但所有事件都会丢失，直到用户在 iframe 移除后重新点击 DOM。这在 Firefox 和 Chrome 中都会发生。 IE 似乎按预期将焦点返回到原始 DOM。我没有在其他浏览器上测试过。

 $(window).keydown(function(e){
    console.log (e.keyCode);   
 });

var $iframe = $("<iframe src='www.example.com'>");
$("body").append($iframe);

window.setTimeout(function(){
 $iframe.remove();
}, 1000);

（上面的代码只是一个例子，我已经包含了一个工作代码笔来进一步说明-http://codepen.io/anon/pen/WQroqe）

使用 codepen -
单击“单击以加载 iframe 按钮”。
确保单击 iframe，使其具有焦点
在 iframe 删除后，键入任何内容并注意 DOM 不会记录您的击键。
单击 DOM 并注意您的击键记录正确。

用例：表单打开一个 iframe 并提交，然后从 DOM 中删除自己。我希望能够在提交表单后检测键盘事件，而无需用户使用鼠标。

问题：我认为最顶层的 DOM 元素是“窗口”，如果这没有捕获键盘事件，那是什么？据我所知，目前不存在其他 DOM（即 iframe）。我测试了这是firefox和chrome。任何关于正在发生的事情以及为什么我试图做的事情是不可能的或捕捉事件的方法的任何解释都将不胜感激。

（我目前的解决方案是使用 MutationObserver 来观察 iframe 消失并强制焦点回到窗口上。我也知道我可以使用 setInterval 来不断检查 iframe。这两种解决方案都感觉我在做额外的事情工作）。

Answer 1

关闭 iframe 后，如果必须使用 $(window).focus(); 聚焦窗口

在示例中你会这样做

  $iframe.load(function(){
    window.setTimeout(function(){
      console.log("deleting");
      $("#deleteMe iframe").remove();
      $(window).focus(); // <======
    }, 5000);  
  });