Target=”_blank” links inside iframe

iframe

I load a page from another domain with iFrame which has target="_blank" links. When I click, the url is opened in a new page as usual. How can I avoid those links to be opened in new windows? I want those links to be opened inside the iframe.

Best Answer

The only real solution would be to change target="_blank" to target="_self". Or remove the target attribute completely and let the default action occur (which is _self).

This question might be a re-post of this: Force any HREF in an IFrame to use its parent as the target, but some of those techniques might be useful to you.

But if the page is on a domain you have no control over, you can't really do anything.

Related Solutions

Html – How to apply CSS to iframe

Edit: This does not work cross domain unless the appropriate CORS header is set.

There are two different things here: the style of the iframe block and the style of the page embedded in the iframe. You can set the style of the iframe block the usual way:

<iframe name="iframe1" id="iframe1" src="empty.htm" 
        frameborder="0" border="0" cellspacing="0"
        style="border-style: none;width: 100%; height: 120px;"></iframe>

The style of the page embedded in the iframe must be either set by including it in the child page:

<link type="text/css" rel="Stylesheet" href="Style/simple.css" />

Or it can be loaded from the parent page with Javascript:

var cssLink = document.createElement("link");
cssLink.href = "style.css"; 
cssLink.rel = "stylesheet"; 
cssLink.type = "text/css"; 
frames['iframe1'].document.head.appendChild(cssLink);

Javascript – jQuery/JavaScript: accessing contents of an iframe

If the <iframe> is from the same domain, the elements are easily accessible as

$("#iFrame").contents().find("#someDiv").removeClass("hidden");

Reference

Best Answer

Related Solutions

Html – How to apply CSS to iframe

Javascript – jQuery/JavaScript: accessing contents of an iframe

Related Topic