Use JavaScript variable as iframe src?

Question

I'm trying to use a JavaScript variable as the src in a <iframe>, the user will then be able to load other content by choosing scr in a menu, which changes the variable. the default src URL is apps/start.php.

Here some code from my index.php:

    <script>
        var appurl = "start.php";
        document.getElementById("app").src = "apps/" + appurl();
    </script>

    <iframe id="app" src="">

    </iframe>

The problem is that i can't get this first small part working... The <script> tag is in the <head>. And when the src is changing will the new document automatically load?

appurl is a variable containing a string, so I don't see why you should execute it — Eric Frick
– Eric Frick, Commented Apr 18, 2013 at 18:06

Travis J · Accepted Answer · 2013-04-18 18:07:17Z

1

Wait for the page to load (note that this is only going to work when the iframe is on your domain)

window.onload = function(){
 var appurl = "start.php";
 document.getElementById("app").src = "apps/" + appurl;
};

answered Apr 18, 2013 at 18:07

Travis J

82.5k43 gold badges213 silver badges280 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Abbe Over a year ago

Thanks now it works! But if the iframe content document is on another domain?

Niels Over a year ago

The iFrame is on your own domain, if you want to access the content of the iFrame of another domain, that is not possible. Because thats cross domain javascripting.

Quentin · Accepted Answer · 2013-04-18 18:08:02Z

1

The problem is that the Javascript is run before the iframe is there. Put your javascript below your iFrame or inside the document ready and it will work.

Example document onload:

<script>
    window.onload = function ()
    {
        var appurl = "start.php";
        document.getElementById("app").src = "apps/" + appurl();
    }
</script>

<iframe id="app" src="">

</iframe>

edited Apr 18, 2013 at 18:08

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

answered Apr 18, 2013 at 18:06

Niels

50.1k4 gold badges68 silver badges86 bronze badges

Comments

Eric Frick · Accepted Answer · 2013-04-18 18:08:19Z

0

<script>
    window.onload = function ()
    {
        var appurl = "start.php";
        document.getElementById("app").src = "apps/" + appurl;
    }
</script>

<iframe id="app" src="">

</iframe>

answered Apr 18, 2013 at 18:08

Eric Frick

8572 gold badges7 silver badges18 bronze badges

Comments

Tamil Selvan C · Accepted Answer · 2013-04-18 18:10:39Z

0

Try

<script>
window.onload = function(){
 var appurl = 'start.php';
 document.getElementById("app").src = "apps/" + appurl;
};
</script>

answered Apr 18, 2013 at 18:10

Tamil Selvan C

20.3k12 gold badges55 silver badges72 bronze badges

Collectives™ on Stack Overflow

Use JavaScript variable as iframe src?

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related