Estoy tratando de cambiar dinámicamente la URL del iframe, para hacerlo estoy llamando a la función window.onmessage = (event) => y activando la URL como variable event.data , esto sucedió desde un botón externo.
Cuando hago clic en el botón externo, el iframe muestra la URL correcta, pero después de 3 segundos cambia a negro (URL en blanco), ¿por qué sucede y cómo resolverlo?
**
**
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <link rel="mask-icon" href="https://assets-cdn.github.com/pinned-octocat.svg" color="#000000"> <link rel="icon" type="image/x-icon" href="https://assets-cdn.github.com/favicon.ico"> <link rel="shortcut icon" type="image/x-icon" href="https://assets-cdn.github.com/favicon.ico"> <style> body { background: #232323; width: 95%; margin: 0 auto; } /* Responsive Container for iFrame */ .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } </style> <title>Tech Ops PH | your < IT / design < partner </title> <script type="text/javascript"> window.onmessage = (event) => { if (event.data) { document.getElementById("myIframe").src=event.data } } </script> </head> <body> <div class='embed-container embed-responsive embed-responsive-4by3'> <iframe id="myIframe" width="600" height="9000" frameborder="0" style="border:0" allowfullscreen></iframe> </div> </body> </html>