如何触发“onload” IE 中文档的事件

发布于 2024-08-14 12:33:13 字数 827 浏览 7 评论 0原文

我目前正在为 Javascript 方法开发单元测试，用于检测文档的准备情况。该代码已经处于框架级别，因此请避免提及已在 jQuery 或其他库中实现的代码。

我已使用以下代码成功模拟了“readystatechange”更改事件：

var event;
event = document.createEventObject();
event.type = 'readystatechange';
document.fireEvent('onreadystatechange',event);

我未能对“load”事件执行相同的操作。以下代码会在 IE7 中导致无效参数错误，该错误是由最后一行调用 fireEvent 引发的：

event = document.createEventObject();
event.type = 'load';
document.fireEvent('onload',event);

有人这样做过，或者之前未能这样做吗？我也对以不同方式启动活动的任何建议感兴趣。

编辑：按照 Crescent Fresh 的建议，我将代码更改为：

event = document.createEventObject();
event.type = 'load';
document.body.fireEvent('onload',event);

不再有错误，但“onload”的侦听器不会触发。这是我的配置方法：

document.attachEvent('onload',listener);

原文

I am currently developing Unit Tests for a Javascript method that detects the readiness of the document. This code is already at framework level, so please avoid mentions of this being already implemented in jQuery or another library.

I have successfully simulated the 'readystatechange' change event with the following code:

var event;
event = document.createEventObject();
event.type = 'readystatechange';
document.fireEvent('onreadystatechange',event);

I failed to do the same for the 'load' event. The following code results in an invalid argument error in IE7, thrown by the call to fireEvent on the last line:

event = document.createEventObject();
event.type = 'load';
document.fireEvent('onload',event);

Has anyone done this, or failed to do this before? I am also interested in any suggestion to fire the event in a different way.

Edit: following the suggestion by Crescent Fresh, I changed my code to:

event = document.createEventObject();
event.type = 'load';
document.body.fireEvent('onload',event);

There is no more error, but the listener for 'onload' does not fire. Here is how I configured it:

document.attachEvent('onload',listener);

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

木落 2024-08-21 12:33:13

根据 MSDN 上的此页面，有document 没有 onload 事件。

您需要 window.onload 或 document.body.onload。这些在 IE 中是相同的：由于历史原因，实际上设置了 window.onload，因此 MS 决定制作 document.body.onload 是 window.onload 的别名。

问题是 - 正如埃里克在评论中提到的 - 似乎没有办法手动触发窗口事件，这意味着埃里克的问题可能没有解决方案。

回复收藏 0 原文

少跟Wǒ拽 2024-08-21 12:33:13

由于某种原因，IE 在 DOM 加载后似乎用空对象覆盖了 window 的 onload 属性。至少当您尝试从 DOM 元素的任何事件处理程序中访问它时是这样的......

<!DOCTYPE html>
<html>
  <head>
    <title>Test by Josh</title>
    <script type="text/javascript">
      window.onload = function() {
        alert("Test");
      }
      alert(typeof window.onload);
    </script>
  </head>
  <body>
    <h1 onclick="alert(typeof window.onload);">Test</h1>
  </body>
</html>

在这种情况下，您会看到 window.onload 最初被识别为函数，然后您会看到“Test”警报。当您单击标题时，您将看到 window.onload 现在是一个对象。我尝试迭代对象的属性，但它是空的。这不酷。

一个蹩脚的解决方法是获取可访问范围中的函数并将其分配给您可以在方便时触发的不同属性......

<!DOCTYPE html>
<html>
  <head>
    <title>Test by Josh</title>
    <script type="text/javascript">
      window.onload = function() {
        alert("Test");
      }         
    </script>
  </head>
  <body>
    <h1 onclick="window.onloadfix()">Test</h1>
    <!-- Could potentially be injected via server-side include if needed -->
    <script type="text/javascript">
      window.onloadfix = function() {
        window.onload();
      }
    </script>
  </body>
</html>

我现在想不出任何其他方法来解决这个问题。

For some reason, it appears that IE overrides the onload property of window with an empty object after the DOM is loaded. At least that is the case when you try to access it from within any event handler of a DOM element...

<!DOCTYPE html>
<html>
  <head>
    <title>Test by Josh</title>
    <script type="text/javascript">
      window.onload = function() {
        alert("Test");
      }
      alert(typeof window.onload);
    </script>
  </head>
  <body>
    <h1 onclick="alert(typeof window.onload);">Test</h1>
  </body>
</html>

In this situation, you'll see that window.onload is recognized as a function initially, then you see the "Test" alert. When you click on the heading, you'll see that window.onload is now an object. I tried iterating through the properties of the object, but it's empty. This is not cool.

One lame workaround is to grab the function in the accessible scope and assign it to a different property that you can fire at your convenience...

<!DOCTYPE html>
<html>
  <head>
    <title>Test by Josh</title>
    <script type="text/javascript">
      window.onload = function() {
        alert("Test");
      }         
    </script>
  </head>
  <body>
    <h1 onclick="window.onloadfix()">Test</h1>
    <!-- Could potentially be injected via server-side include if needed -->
    <script type="text/javascript">
      window.onloadfix = function() {
        window.onload();
      }
    </script>
  </body>
</html>

I can't think of any other way to address this issue right now.

回复收藏 0 原文