Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Access jQuery library from iframe

Tags:

jquery

iframe

I have a legacy application that uses iframes. It has an iframe in the parent page, that is dynamically replaced with other pages.

JQuery is loaded in the parent. Is there some type of plugin that will allow me to access the jquery core that is loaded in the parent from the iframe pages without including jquery (language="JavaScript" src="../javascript/jquery.js") in the multiple child (iframe) pages?

For example, the iframe is static

<iframe name="mainWindow" src="includes/View.asp frameborder="0" />

I know there are better ways to do this, but I am stuck with this architecture at the moment. Any suggestions?

like image 877
Doose Avatar asked Mar 30 '11 03:03

Doose


People also ask

Can you access the content of an iframe?

You could use . contents() method of jQuery. The . contents() method can also be used to get the content document of an iframe, if the iframe is on the same domain as the main page.

How do I access elements in an iframe?

Getting the element in IframegetElementById() method by passing iframe id as an argument. const iframe = document. getElementById("myIframe"); Now, it has and contentWindow property which returns the document object by using that we can access the elements from an Iframe.

How to select element inside iframe using jQuery?

Learning jQuery However, it's also possible to use a really simple jQuery to access the elements within the iFrame. Check it out below: $(document). ready(function(){ var iFrameDOM = $("iframe#frameID").

How do I use iframe tags?

Definition and UsageThe <iframe> tag specifies an inline frame. An inline frame is used to embed another document within the current HTML document. Tip: Use CSS to style the <iframe> (see example below). Tip: It is a good practice to always include a title attribute for the <iframe> .


1 Answers

You could try running this from inside your iframe:

var $ = jQuery = window.parent.$;

Assuming the parent and iframe are on the same domain.

Just tested it, example: http://jsfiddle.net/qA7yE/

(That example uses different code - the child iframe calls the parent's foo() function, but the same principle applies)

Also, just to be on the safe side you may want to do:

var $ = window.parent.$, jQuery = window.parent.jQuery;
like image 128
mattsven Avatar answered Sep 27 '22 00:09

mattsven