iFrame 加载 JavaScript 事件答案

【问题标题】：iFrame onload JavaScript eventiFrame 加载 JavaScript 事件
【发布时间】：2025-12-07 15:30:01
【问题描述】：

我有一个 iFrame，我想在加载后发送一个 JavaScript 命令。我当前的代码如下所示：

<iframe src="http://www.test.tld/" onload="__doPostBack('ctl00$ctl00$bLogout','')">

但是使用这段代码，命令不会被执行。我必须改变什么才能让它工作？只需要支持 Chrome 和 Firefox。

【问题讨论】：

iframe 是否加载 test.tld 页面？
是的，没有问题
你怎么知道“命令没有执行”？
因为我还处于登录状态。如果我点击网站上的“注销”按钮将触发我退出的命令。
err，你“登录”了吗？试试：<iframe src="http://www.w3schools.com" onload="alert('test')" />

标签： javascript iframe dom-events onload onload-event

【解决方案1】：

使用JavaScript的iFrame的.onload函数：

<iframe id="my_iframe" src="http://www.test.tld/">
    <script type="text/javascript">
        document.getElementById('my_iframe').onload = function() {
            __doPostBack('ctl00$ctl00$bLogout','');
        }
    </script>
    <!--OTHER STUFF-->
</iframe>

【讨论】：

也许你可以看看这个subinsb.com/jquery-to-javascript)的原生javascript版本
这似乎也不起作用：test.tld" id="loadTo"> xhr.onreadystatechange=function(){ if(xhr.readyState==4 && xhr .status==200){ document.getElementById("loadTo").innerHTML = __doPostBack('ctl00$ctl00$bLogout',''); } }
我将代码更改为 javascript。我希望这会奏效，我自己还没有测试过。 @Peleke
谢谢，但这也无济于事。也许不可能！？网站上注销按钮的代码是 (Logout)
在liveweave.com/9ngqqd 上看看这个我在这里工作（尝试从 iframe 更改 url 以加载一些大页面）

【解决方案2】：

document.querySelector("iframe").addEventListener( "load", function(e) {

    this.style.backgroundColor = "red";
    alert(this.nodeName);

    console.log(e.target);

} );

&lt;iframe src="example.com" &gt;&lt;/iframe&gt;

【讨论】：

这种添加“加载”侦听器的方式与他们设置 iframe.onload = a function 的其他答案有什么区别？
@rasen58，他们都做同样的事情。 addEventListener 的优点是可以将more than one event listener 添加到加载事件中。请参阅此答案以获取更多详细信息。 *.com/a/6348533/9695286

【解决方案3】：

您的代码是正确的。只需测试以确保它被调用喜欢：

<script>
function doIt(){
  alert("here i am!");
  __doPostBack('ctl00$ctl00$bLogout','')
}
</script>

<iframe onload="doIt()"></iframe>

【讨论】：

尝试： sdsd.com"></iframe>
确保加载到 iframe 中的 URL 允许加载，“检查 Chrome 开发工具中的输出以了解加载错误”。好像不允许加载一样，永远不会调用 onload 事件。当我运行此代码时，URL“sdsd.com”没有任何限制，也没有加载错误。试试看。
确保负载中的 L 是小写的，所以 "l" 而不是 "L" 。所以 onload="doIt()" 不是 onLoad="doIt()"

【解决方案4】：

更新

从 jQuery 3.0 开始，新语法只是 .on:

查看answer here 和代码：

$('iframe').on('load', function() {
    // do stuff 
});

【讨论】：