Blackwolf
Blackwolf

Reputation: 105

How do I get my JavaScript to change the src of my iframe?

I have the following layout

 _______________________________________________________
| iframe                                                |
| ______  _____________________________________  ______ |
|| menu ||info                                 ||advert||
||      ||                                     ||      ||
||      ||                                     ||      ||
||      ||                                     ||      ||
||      ||                                     ||      ||

I have read many pages of answers and they all seem to say the same things, but i still can't get my code to work.

I want links in my MENU to change the iframe, which will load new topics each with their own menu. Also some pages in my INFO box need to change the source of the iframe.

An example is when I want to log out of my account and return to my homepage: I hit LOGOUT on the MENU, which loads logout.php into INFO and nulls all variables followed by this ...

<script type="text/javascript">
    top.document.getElementById('iframeid').src='home.php';
</script>

I have also tried (and variations of)

document.getElementById('iframeid').src='home.php';
parent.document.getElementById('iframeid').src='home.php';
top.document.getElementById('iframeid').location='home.php';
top.document.getElementById('iframeid').location='WEBSITE/home.php';

It looks like such a simple thing, but I have now spent over 24 hours on this - any clues please?

Upvotes: 0

Views: 73

Answers (3)

Blackwolf
Blackwolf

Reputation: 105

OK, i've figured this out now - due to not being able to update the iframe containing the JS, i tried to update the parent iframe and this worked, so to overcome this practically, all i have done is generated a new iframe with the exact same attributes as this one and placed it behind. i can change the source of the new one and just include this functional iframe again at the beginning of each page - thank you for all your help guys. i hope this also helps other people

Upvotes: 0

Wachiwi
Wachiwi

Reputation: 312

you can do it via iframe.src = 'home.php'. But you need to make sure you execute your JS code is executed after the "onload" event.

window.onload = function() {
  ...
}

See this fiddle for an example.

Upvotes: 1

woverton
woverton

Reputation: 481

You may change the src value of the iframe.

example: https://jsfiddle.net/0g4uoymt/1/

setTimeout(function(){
    $("iframe").attr("src", "https://i.imgur.com/eMPOYrO.webm");
}, 1000);

Upvotes: 1

Related Questions