simple

2008-07-11 @ 02:18

jGeek

Thanks, this was a big help. Works for me!

2008-08-14 @ 12:04

Taras

You’re welcome, jGeek!

2008-09-17 @ 19:23

rog

… with this kind of thing, is’nt it possible to steal other peoples email, etc … (?)

2008-09-17 @ 20:36

Taras

Rog, what you mean?

2008-09-18 @ 00:29

rog

i must be wrong somehow … but, this is what I thought when i read your tip :: i deliver a web page, with an iframe in it with src of mail.google.com. i hide the iframe somewhere/how, and using the jquery code, read the content and post the interesting stuff back to my original server … (?)

2008-09-18 @ 01:28

Mike

This didn’t work for me. One thing you must keep in mind is that just because the parent page is loaded or ready, doesn’t mean the frame is done. Here’s what i got to work:

[code]


		jQuery and Frames
			jQuery( function() {

				$(’#frame1′).load( function(){

					$(this.contentDocument).find(’body’).html(’This frame was modified with jQuery! Yay!!!’)

				});

				$(’#frame2′).load( function(){

					$(this.contentDocument).find(’body’).html(’This frame was modified with jQuery! Yay!!!’)

				});

			});
		jQuery and Frames
		Frame from the same domain as parent.
		Frame from a different domain as parent.

[code]

rog, good thinking… but browsers follow similar rules with iframes as they do with xml_http_requests: that is, it blocks cross-domain access.

For example, if I am running the above script from the page: http://www.liveintensely.com/parent.html, I can read and write to the frame which’ source is http://www.liveintensely.com/frame1.html. HOWEVER, if the frame’s source is on a different domain, like http://www.google.com, javascript is denied both read and write access to the frame.

2008-09-18 @ 01:39

Mike

Wow… didn’t know html came through when posting. Please excuse the double post.

This didn’t work for me. One thing you must keep in mind is that just because the parent page is loaded or ready, doesn’t mean the frame is done. Here’s what i got to work (the first example):

<html> <head> <title>jQuery and Frames</title> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> jQuery( function() { $('#frame1').load( function(){ $(this.contentDocument).find('body').html('This frame was modified with jQuery! Yay!!!') }); $('#frame2').load( function(){ $(this.contentDocument).find('body').html('This frame was modified with jQuery! Yay!!!') }); }); </script> </head> <body> <h2>jQuery and Frames</h2> <h4>Frame from the <i>same</i> domain as parent.</h4> <iframe id="frame1" src="iframe.html"></iframe> <h4>Frame from a <i>different</i> domain as parent.</h4> <iframe id="frame2" src="http://google.com"></iframe> </body> </html>

rog, good thinking… but browsers follow similar rules with iframes as they do with xml_http_requests: that is, it blocks cross-domain access.

For example, if I am running the above script from the page: http://www.liveintensely.com/parent.html, I can read and write to the frame which’ source is http://www.liveintensely.com/iframe.html. HOWEVER, if the frame’s source is on a different domain, like http://www.google.com, javascript is denied both read and write access to the frame.

2008-09-18 @ 20:11

rog

thanks for your reply. i couldn’t imagine that this would be possible - but it’s good to know exactly the mechanics of how it works … thanks.

2008-11-24 @ 11:13

yAnTar

Good work, very thanks.

2008-11-27 @ 05:18

Taras

Нема за що ))

2009-01-14 @ 01:26

Peter

Mike, I’m quite a jQuery noob, but:

* shouldn’t it be $(’#frame1′).ready() instead of $(’#frame1′).load() ? “load” doesn’t seem to trigger anything (but no errors either).

* doesn’t $(this.contentDocument) refer to the current document instead of the iframes?

2009-02-11 @ 17:04

lando

you have no idea how invaluable this tidbit of knowledge has been for me

2009-03-12 @ 00:19

Valtos

A reverse Proxy should be the right thing for your Problem. @rog

2009-03-18 @ 14:02

Renatogarou

Hello !
Can I use this method for acess the content of Tinymce ? How ?

Sorry my English .

2009-03-24 @ 14:18

Taras

Renatogarou, I think you can use this with TinyMCE, but I’m not familiar with it so unable to provide more help… Probably you can find information you’re looking for in TinyMCE API documentation.

2009-04-03 @ 10:44

_ts_

Hi fellas.
How can I pass param(s) to load handler?

2009-04-03 @ 16:32

roberto

thanks a lot. it works

2009-04-03 @ 16:39

Taras

_ts_,
what you mean?

roberto,
you’re welcome

2009-04-07 @ 13:41

_ts_

2 Taras
Thank you. I’ve already found the solution for my question.

But I’ve another one.

if iFrame has some function named as “someFunction” and how can I call this function from parent window?

Thank you!

2009-05-11 @ 19:52

Matt

sure… just:
[code]
frameId.someFunction(params);
[/code]

(assuming )
at least that works in firefox 3.0.10…

cheers, matt

2009-05-14 @ 07:46

Nate

Hi, I’ve looked at the code suggested by Taras and Mike; thanks guys. But I found that neither of them work very well. Jquery converts HTML objects into object objects, which restricts the abilities of manipulating iframes. I found that a better approach to address an iframe is using the best of both worlds:

var iframeRef = document.getElementById(’iframeID’);
$(iframeRef).find(’html’).html(’your content here’);

2009-05-20 @ 20:51

bitlimakina

thx.

2009-05-28 @ 20:07

khris7

Taras hey! Thank you very much!!
this tiny bit of information saved me hours of working. ^^

2009-06-04 @ 09:58

Dals

2 Nate:
I think, for jQuery way we can get

var iframeRef = document.getElementById(’iframeID’);

by simple:

var iframeRef = $(’#iframeID’);

2009-06-16 @ 13:42

Paisal

Thankyou so much, How about iframe 2 level deep (get value from iframe inside iframe).

Best regards,

2009-06-17 @ 14:29

John

hi
I’m trying to add script tag to the Head of the Iframe but it doesn’t work

can you help me with that, this is my code

$(iframe).contents().find(’head’).html(”
+ ”);

the css file included correctly but the script tag no
any help

2009-06-26 @ 21:49

Tom

Thanks a ton for posting this. I didn’t read the comments but I’m sure somewhere up there, someone is trying to prove that they’re smarter than you…just the nature of being a web developer I suppose. Just know that I’m sure this little piece of code probably saved someone their job at some point…me, just saved me from losing another day of work trying to figure this out, lol.

2009-07-03 @ 19:46

mos

if in reverst,

how can i out the value from the abc.com into “list”

thanks,

2009-07-03 @ 19:47

mos

if in reverst,
div id=list /div

iframe src=abc.com

how can i output the value from the abc.com into “list”

thanks,

2009-07-24 @ 17:31

fer

Thanks !

2009-09-01 @ 23:57

sophisticado

Good stuff here. My question is how can a script embedded in the document within the iframe close the entire jquery dialog which was called from the parent?

2009-09-30 @ 14:37

steve

I have done so much in Jquery and have learned most tricks of the trade but this is probably the best thing I have ever come across. I am so excited about the endless posibilitys that this will bring. Thanks sooooooooo much for sharing!

2009-10-16 @ 13:41

Ricardo

Thaks! thats help me and work for me.

2009-10-23 @ 16:07

Shubhajeet Sinha

This is not working for me. Please help me for this. I am posting the jquery code here

the id of iframe is #depGridFrame

$(’#depGridFrame’).ready(function()
{
alert($(this).contents().find(’#updtGrid’).tagName);
});

i am calling it from document.ready function of parent document.

2009-12-04 @ 19:12

izdelava spletne strani

These iframes are getting on my nerves. I can’t get it right …

2009-12-16 @ 23:36

cbsides

If anyone is still having trouble with selecting iframe contents w/jQuery I’ve verified this as working (keep in mind the iframe must be in the same domain as the accessing page, as mentioned above):

var myFrame = $(’#myFrameId’);
myFrame.load(function() { // wait for iframe to load
myFrame.contents().find(’#myElementInFrame’).html(’hello world!’);
});