6

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?

Starx
  • 77,474
  • 47
  • 185
  • 261
Doose
  • 61
  • 1
  • 1
  • 2

2 Answers2

9

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;
mattsven
  • 22,305
  • 11
  • 68
  • 104
  • Cant get this to work, am kinda new to jquery. this is what I have in the iframe
    foo
    and the iframe is in a page that has the jquery core.     – Doose Mar 30 '11 at 05:31
  • OK, are the pages on the same domain? I would try something more simple, just to make sure it is working like `window.parent.foo()`, and check the console. – mattsven Mar 30 '11 at 13:25
  • This is not work on fancybox. How can I solve this problem? – namal Feb 14 '16 at 04:45
  • I'm not familiar with Fancybox, and how it works. You should post a separate question. – mattsven Feb 14 '16 at 13:47
0

Not valid, the object refers to the parent, not the iframe. Try a simple $('body').css('background','red') inside the iframe; it applies to the parent not the iframe.

Carl0s1z
  • 4,683
  • 7
  • 32
  • 47
user3293637
  • 1