javascript 为什么 IE8 不处理 iframe onload 事件?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12910534/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 17:25:18  来源:igfitidea点击:

Why doesn't IE8 handle iframe onload events?

javascripthtmliframeinternet-explorer-8

提问by Mori

Sample code:

示例代码:

<!DOCTYPE html>
<html>
<head>
<title></title>
<script>
function on_iframe_load() {
    document.getElementById('iframe_a').onload = function() {
        alert('Thanks for the visit!');
    };
}
</script>
</head>
<body>
<iframe name="iframe_a" id="iframe_a"></iframe>
<a href="http://www.example.com/" target="iframe_a" onclick="on_iframe_load();">Go!</a>
</body>
</html>

It works in all major browsers with no problem, but IE8 (and probably prior versions) don't understand it.

它适用于所有主要浏览器,没有问题,但 IE8(可能还有以前的版本)不理解它。

Update: Just came up with a solution, but I'm not sure if it's right coding. Please review:

更新:刚刚提出了一个解决方案,但我不确定它是否正确编码。请查阅:

<!DOCTYPE html>
<html>

    <head>
        <title></title>
        <script>
            var clicked = false;

            function activate() {
                clicked = true;
            }

            function pop() {
                if (clicked) {
                    alert('Thanks for the visit!');
                };
            }
        </script>
    </head>

    <body>
        <iframe name="iframe_a" onload="pop();"></iframe>
        <a href="http://www.example.com/" target="iframe_a" onclick="activate();">Go!</a>

    </body>

</html>

回答by Inferpse

Using inline attribute on iframe seems to fix this issue in IE8:

在 iframe 上使用内联属性似乎可以解决 IE8 中的这个问题:

<!DOCTYPE html>
<html>
<head>
<title></title>
<script>
function onIframeLoad(iframe) {
    if(iframe.src) {
        alert('Thanks for the visit!');
    }
}
function onLinkClick(url) {
    document.getElementById('iframe_a').src = url;
}
</script>
</head>
<body>
<iframe id="iframe_a" onload="onIframeLoad(this);"></iframe>
<a href="http://www.example.com/" onclick="onLinkClick(this); return false;">Go!</a>
</body>
</html>

update by request:

按要求更新:

You should try writing more unobtrusive javascript. Writing code in such way may prevent you from such strange bugs in IE.

您应该尝试编写更不显眼的 javascript。以这种方式编写代码可能会阻止您在 IE 中遇到此类奇怪的错误。

<!DOCTYPE html>
<html>
<body>
    <iframe id="display-frame"></iframe>
    <a href="http://www.example.com/">Go!</a>
    <script>
        window.onload = function() {
            var iframe = document.getElementById('display-frame'),
                link = document.getElementsByTagName('a')[0];

            // load handler
            function onIframeLoad() {
                alert('Thanks for the visit!');
            }

            // event handlers
            if(iframe.addEventListener) iframe.addEventListener('load', onIframeLoad, false);
            else if(iframe.attachEvent) iframe.attachEvent('onload', onIframeLoad);

            link.onclick = function() {
                iframe.src = this.href;
                return false;
            }
        };
    </script>
</body>
</html>

回答by StackOverFlow

It works :)

有用 :)

tested on IE8, ff, chrome

在 IE8、ff、chrome 上测试

var iframe = document.getElementById('iframeid');

    if (iframe .attachEvent) {
      iframe .attachEvent('onload',alert("IE Iframe loaded"));

    } else {
      iframe .onload = alert("Other than IE Iframe loaded");
    }

回答by Andris

Just use jquery:

只需使用jQuery:

$(iframe).bind( 'load', function(){} );

回答by RobG

It seems you can't add a load listener to an iFrame in IE using the DOM property once the page has loaded.

一旦页面加载完毕,您似乎无法使用 DOM 属性向 IE 中的 iFrame 添加加载侦听器。

But you can use attachEvent, so:

但是你可以使用attachEvent,所以:

function on_iframe_load() {
    function foo() {
        alert('Thanks for the visit!');
    };
    var el = document.getElementById('iframe_a');

    if (el.attachEvent) {
      el.attachEvent('onload',foo);
    } else if (el.addEventListener) {
      el.addEventListener('load', 'foo', false);
    }
}

I was testing in IE 6 and reversed the usual test order so that attachEventis used in preference to addEventListener. You may want to test more recent versions of IE to see if the opposite order works and also test other IE–like browsers such as Opera.

我在 IE 6 中进行测试并颠倒了通常的测试顺序,以便attachEvent优先使用addEventListener. 您可能想要测试更新版本的 IE 以查看相反的顺序是否有效,并测试其他类似 IE 的浏览器,例如 Opera。

Edit

编辑

Modified the code after testing (silly me) to use addEventListener. Here's something that works in IE and others:

测试后修改代码(傻我)以使用addEventListener. 这是在 IE 和其他人中有效的东西:

function on_iframe_load() {
    function foo() {
        alert('Thanks for the visit!');
    };
    var el = document.getElementById('iframe_a');

    if (el.attachEvent) {
      el.attachEvent('onload',foo);

    } else {
      el.onload = foo;
    }
}

And if you use an onload attribute in the markup, you don't need to add the listener using script.

如果您在标记中使用 onload 属性,则无需使用脚本添加侦听器。