Search code examples
javascripthtmliframeexternal-links

calling an iframe inside a js function

I'm trying to create an external link, that appears within the same site.

Here, If I click on a link it should display the contents of that link(external site) within our site. i.e., if my site is siteA and in that I place a link (to siteB) that will redirect to 'siteB' closing 'siteA'. I just want to avoid the situation besides I want to make the siteB to be opened within the siteA

My idea is when the link is opened, an iframe will be created and the external site will be opened within that Iframe.

 <a href="http://www.google.com" target="your_frame_name" onclick="executeOnClick()">Google</a>

 <script type="text/javascript">

   function executeOnClick(){
      <iframe name="your_frame_name" src="www.google.com" > </iframe>
             return true;
        }

       </script>

I wrote this code, but couldn't get what I expect. I tried to use button, but it's not working.

Is there any other way to fix my issue..

Solution

  • No javascript is needed, use target attribute:

    <a href="http://www.hopamchuan.com" target="iframe1">Load the page</a>

<iframe id="iframe1"> </iframe>

    JSFiddle

    IMPORTANT: you cannot display http://google.com in iframes because of their X-Frame-Options. See: The X-Frame-Options response header