Well, I'm running the following code that modifies the content of the iframe, and since both pages are in my site this goes without problems (it's not the problem):
<!DOCTYPE html>
<html>
<body>
<iframe id="myframe" src="demo_iframe.htm"></iframe>
<p>Click the button to change the background color of the document contained in the iframe.</p>
<p id="demo"></p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var x = document.getElementById("myframe");
var y = x.contentDocument;
y.body.style.backgroundColor = "red";
}
</script>
</body>
</html>
The page I post is as follows:
<html><head></head><body>
<p>This is some text in an iframe. This is some text in an iframe. This is some text in an iframe. This is some text in an iframe. This is some text in an iframe. This is some text in an iframe.</p>
</body></html>
What matters: I need that when loading my page in the iframe, the page I post will be updated.
How to execute myFunction (), update the page and continue with the rest of the function? (but update the page before continuing with the function, it just does not work for me)
I tried uselessly with the following code, if it updates but does not execute the rest of the function that I also need:
<script>
function myFunction() {
var x = document.getElementById("myframe");
var w = x.contentDocument;
w.location.reload();
var y = x.contentDocument;
y.body.style.backgroundColor = "red";
}
</script>