Guy Guy - 2 months ago 8
HTML Question

Onclick opens URL in new TAB but not the second URL in iframe

I've got some help here a few days ago, but the the answer I've got did not work for me eventually and I am still looking how to fix the issue.

I have this page test:

http://cpanel2.secured.co.il/~iherbcoi/test.html

I have many links that include:


  1. A URL that opens in HREF in a new TAB.

  2. An onclick event that opens a second URL inside an iframe on the source page.



I've taken the original link that worked good and wanted to change the onclick URL into a value that will be taken from a JS from the HEAD of the page.

This was my original HREF/onclick that worked fine:

<a href="http://www.cnn.com" target="_blank" onClick=document.getElementById("if").src='http://www.yahoo.com';>Original Link</a>


The issue is that the URL that opens in iframe is the same as the one that opened in a new TAB, instead of the onclick URL.

I also have an issue that cause the page source to refresh in a whole once the iframe is loading its content. How can avoid this please?

This is the code that is used at the moment:

The HEAD code:

<script type="text/javascript">
function Link() {
document.getElementById("iframe_test").href = "http://www.yahoo.com";
}
</script>


The link:

<a href="http://www.cnn.com" onClick="window.open(this.href)" target="iframe_test">JS HEAD code based link</a>


The iframe:

<iframe id="iframeid" name="iframe_test" frameborder="0" scrolling="no" width="400px" height="400px"></iframe>

Answer

Unless I've misunderstood, try onclick="Link()" to actually call the function in your script. At the moment you are telling the window to open the href in the iframe.

Then change your target back to _blank

You also have a few typos which will stop stuff being called

HTML:

<a href="http://www.cnn.com" onclick="Link()" target="_blank">Click</a>

<iframe id="iframe_test" src="" frameborder="0" scrolling="no" width="400px" height="400px"></iframe>

JS:

function Link() {

   document.getElementById("iframe_test").src = "http://www.yahoo.com";

}
Comments