javascript 我可以在加载由 jquery 附加的 iframe 后调用函数吗?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/9466596/
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 06:46:24  来源:igfitidea点击:

Can I call a function after the loading of an iframe appended by jquery?

javascriptjqueryhtmliframe

提问by markzzz

This is my code:

这是我的代码

?<div id="myContent???????"></div>?

$('#myContent').html('<iframe height="200" frameborder="0" src="www.google.com"></iframe>');?

and I'd like, when the whole page in the frame is totally loaded, call a function, like alert("I'm finished");.

我想,当框架中的整个页面完全加载时,调用一个函数,比如alert("I'm finished");.

How can I do it?

我该怎么做?

P.S. dunno why jsfiddle doesnt catch the google page :)

PS 不知道为什么 jsfiddle 没有抓住谷歌页面:)

回答by vdeantoni

You can do it with the event .load()(Check the api for more info).

您可以使用事件.load() 来完成(查看 api 以获取更多信息)。

Example:

例子:

$('#myContent').html('<iframe id="winId" height="200" frameborder="0" src="www.google.com"></iframe>');

$('#winId').load(function() {alert('loaded')})

回答by Neeraj

In a nutshell, unless the iframe has the source url on the same domain/subdomain, checking if it has loaded completely, or expecting any kind of events to be propogated from a frame to the parent window is not possible.

简而言之,除非 iframe 在同一个域/子域上具有源 url,否则检查它是否已完全加载或期望任何类型的事件从框架传播到父窗口都是不可能的。

The same domain policy clearly stops developers from doing such stuff.

相同的域策略显然阻止了开发人员做这样的事情。

Though there are a few workarounds ,e.g the code inside the iframe can change its url and keep passing information using hash tags and vice-a-versa.

尽管有一些解决方法,例如 iframe 内的代码可以更改其 url 并使用哈希标签继续传递信息,反之亦然。

回答by Royi Namir

$('#myContent').html('<iframe height="200" frameborder="0" src="www.google.com" onload="myfunc()"></iframe>');

you should have in the page containing the IFRAME :

你应该在包含 IFRAME 的页面中:

 function myfunc()
    {
       alert('.......');
    }

edit : the following will Not work.

编辑:以下将不起作用。

 $('#myContent').on('load','#myIdframe',function (){alert('.....');});

since :

自从 :

From the documentation: In all browsers, the load event does not bubble. [...] Such events are not supported for use with delegation, but they can be used when the event handler is directly attached to the element generating the event.

来自文档:在所有浏览器中,加载事件不会冒泡。[...] 此类事件不支持与委托一起使用,但当事件处理程序直接附加到生成事件的元素时,可以使用它们。

heres 2 examples :

继承人2个例子:

1 work and 1 doesn't

1 个有效,1 个无效

http://jsbin.com/emuzop/2/edit#javascript,html

http://jsbin.com/emuzop/2/edit#javascript,html

http://jsbin.com/emuzop/3/edit#javascript,html

http://jsbin.com/emuzop/3/edit#javascript,html

回答by Ortiga

Create the element, then attach the load event:

创建元素,然后附加加载事件:

var frame = $('<iframe height="200" frameborder="0" src=http://www.google.com />');

$('body').append(frame);
frame.load(function(){
    alert('loaded');
});

fiddle:

小提琴:

http://jsfiddle.net/x7EXa/

http://jsfiddle.net/x7EXa/