在帧上设置偶数监听器时的竞争条件

时间:2018-04-17 07:24:07

标签: javascript html listener frame

我正在尝试在由框架组成的页面上设置全局键盘事件侦听器,当我太早开始键入时,我会得到一种奇怪的行为。

主页面如下:

<html>
   <head>
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <title>My title</title>
   </head>
   <frameset rows="*" cols="250,*" framespacing="3" frameborder="yes" border="1" class="doc-result-frameset">
       <frame src="left.html" name="info" id="info" scrolling="auto" class="doc-result-frame-info">
       <frame src="right.html" name="doc" id="doc" class="doc-result-frame-doc">
   </frameset>
   <noframes>&lt;body&gt;&lt;/body&gt;</noframes>
</html>

右框架是一个比左框架加载更长时间的页面。左边框架是我试图添加一些javascript来控制整个页面的地方。

我写了以下内容:

top.window.addEventListener("keydown",
   function(event: KeyboardEvent) {handleKeyboardEvent(event, previous, next);},
   true);
var topWindowFrames : Window = top.window.frames;
for (var i = 0; i < topWindowFrames.length; i ++) {
   var frame : Window = topWindowFrames[i];
   frame.onload = (function(frame: Window) {
      return function() {
         frame.document.addEventListener("keydown",
            function(event: KeyboardEvent) {handleKeyboardEvent(event, previous, next);},
            true);};
         })(frame);   
}

我也尝试过不将frame.onload包装在另一个函数中,只需在代码中使用frame

我得到的问题是,如果我重新加载页面,并且非常快速地点击右框架以使其聚焦并开始键入,则左框架的事件监听器将永远不会工作。相反,如果我等到所有内容都被加载开始输入或点击,一切正常。

我不知道出了什么问题,因为我无法找到一种方法来检查每个帧都注册了哪些听众。

1 个答案:

答案 0 :(得分:0)

通过body.onLoad

触发事件侦听器的绑定
<body onLoad="bindEvents()">