Jump to content
Sign in to follow this  
gongpex

javascript contentWidth didn't work after open other page

Recommended Posts

Hello everyone,

Alright, I think it's hard to write my trouble here,

so, please visit : https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_element_iframe

And then just replace those code with these :

<!DOCTYPE html>
<html>
<body>

<iframe id="myFrame" src="/default.asp" style="height:380px;width:100%"></iframe>

<p>Click the on the iframe to change w3schools background color</p>

<script>
document.getElementById("myFrame").contentWindow.onclick = test;
function test() {
  var iframe = document.getElementById("myFrame");
  var elmnt = iframe.contentWindow;
  elmnt.document.body.style.backgroundColor = "yellow";
}
</script>

</body>
</html>

These code runs well when I clicked on iframe once, but after I clicked another link page eg : Learn HTML

these code didn't work. it looks if iframe / browser unable to caught event (onclick).

Q : How to fix so that event still able to catch by contentWidth , though user click another link page?

please help me.

Thanks

Share this post


Link to post
Share on other sites

That click event is set on an element inside the iframe, so if you're not clicking inside the iframe it's not going to fire that event.  

Share this post


Link to post
Share on other sites
10 hours ago, justsomeguy said:

That click event is set on an element inside the iframe

Hello,

thanks for reply,

Q : so in other word when client / user clicked on link and then jump to other page, it cause element inside the iframe changed also?

actually my purpose is to make it able to fire the event,  although inside iframe.

please help me how to fix this

Thanks

Edited by gongpex
this forum's system error, cause submit automatically

Share this post


Link to post
Share on other sites

If someone clicks a link outside of the iframe then that is going to change the page that contains the iframe, so yeah the entire page changes.  Unless the link specifically targets the iframe to load the URL, in that case then only the iframe will change (which means all event listeners inside the iframe will also be reset).  If someone clicks a link inside the iframe then the default behavior is to just change the iframe, again unless they tell it to load the URL in the parent page.

Share this post


Link to post
Share on other sites

Hello, thanks for reply

again unless they tell it to load the URL in the parent page

Q : Which URL? did u mean URL from page inside iframe? 

how about if put some script inside the iframe like this :

<iframe id="myFrame" src="/default.asp" style="height:380px;width:100%">
<script>
document.getElementById("myFrame").contentWindow.onclick = test;
function test() {
  var iframe = document.getElementById("myFrame");
  var elmnt = iframe.contentWindow;
  elmnt.document.body.style.backgroundColor = "yellow";
}
</script>
</iframe>

please help

Thanks

Share this post


Link to post
Share on other sites

Content like that is not allowed inside an iframe.  The only content that goes inside an iframe is some message to show someone whose browser does not support the iframe.

If you put that outside of the iframe, then it should add a click event to the document inside that will be there unless it gets overwritten by something in the iframe, or until someone clicks a link a the page in the iframe refreshes.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×