title: Changing parent window's URL from IFrame
body: <p>I have a situation where I have web apps on two different servers, where App1 contains App2 in an IFrame.  Any links in App2 can have <code>target="_parent"</code> attribute, which allow those links to open in the top window.  However, I can't find any way to get the same behavior in Javascript.  I found <a href="http://av5.com/docs/changing-parent-window-s-url-from-iframe-content.html" rel="nofollow noreferrer">this page</a>, which <em>claims</em> that the child frame can call javascript on the parent frame using <code>parent.foo()</code>, but that doesn't seem to work in IE8 or FF3.5.  I found <a href="https://stackoverflow.com/questions/1157233/cross-domain-javascript-parent-location-setting-firefox-error">this SO question</a> which explains how this security model works.  But it seems odd that I can't do in Javascript what I can do with a simple <code>&lt;a&gt;</code> tag.  <strong>Is there any workaround to this at all?</strong> I know about <a href="https://developer.mozilla.org/en/DOM/window.postMessage" rel="nofollow noreferrer">window.postMessage</a>, but (as far as I know) this only works in Firefox.</p>
  
  <hr>
  
  <h2>Example</h2>
  
  <h3>server1/test.html</h3>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript"&gt;
  function myCallback(foo) {
    alert(foo);
  }
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;iframe src="http://server2/test2.htm" width="400" height="150"&gt;&lt;/iframe&gt;
  &lt;/body&gt;&lt;/html&gt;
  </code></pre>
  
  <h3>server2/test2.html</h3>
  
  <pre><code>&lt;html&gt;&lt;body&gt;
  &lt;script&gt;
  function clickit() {
    parent.document.location = "http://www.google.com"; //not allowed
    parent.myCallback("http://www.google.com"); //not allowed
  }
  &lt;/script&gt;
  &lt;p&gt;This should be in an iFrame!&lt;/p&gt;
  &lt;p&gt;&lt;a href="http://www.google.com" target="_parent"&gt;normal link (works)&lt;/a&gt;&lt;/p&gt;
  &lt;p&gt;&lt;a href="javascript:clickit()"&gt;javascript link&lt;/a&gt;&lt;/p&gt;
  &lt;/body&gt;&lt;/html&gt;
  </code></pre>