Llamar a una función de ventana principal desde un iframe
Quiero llamar a una función JavaScript de la ventana principal desde un iframe.
<script>
function abc()
{
alert("sss");
}
</script>
<iframe id="myFrame">
<a onclick="abc();" href="#">Call Me</a>
</iframe>
<a onclick="parent.abc();" href="#" >Call Me </a>
Ver ventana.parent
Devuelve una referencia al padre de la ventana o subtrama actual.
Si una ventana no tiene un padre, su propiedad principal es una referencia a sí misma.
Cuando una ventana se carga en <iframe>, <object>o <frame>, su padre es la ventana con el elemento que incrusta la ventana.
Ventana.postMessage()
Este método permite cross-originla comunicación de forma segura.
Y si tiene acceso al código de la página principal, se puede llamar a cualquier método principal y se pueden pasar datos directamente desde Iframe. Aquí hay un pequeño ejemplo:
Página principal:
if (window.addEventListener) {
window.addEventListener("message", onMessage, false);
}
else if (window.attachEvent) {
window.attachEvent("onmessage", onMessage, false);
}
function onMessage(event) {
// Check sender origin to be trusted
if (event.origin !== "http://example.com") return;
var data = event.data;
if (typeof(window[data.func]) == "function") {
window[data.func].call(null, data.message);
}
}
// Function to be called from iframe
function parentFunc(message) {
alert(message);
}
Código de marco flotante:
window.parent.postMessage({
'func': 'parentFunc',
'message': 'Message text from iframe.'
}, "*");
// Use target origin instead of *
ACTUALIZACIONES:
Nota de seguridad:
Proporcione siempre un targetOrigin específico, NOT *, si sabe dónde debe ubicarse el documento de la otra ventana. Si no se proporciona un objetivo específico, se revelan los datos que envía a cualquier sitio malicioso interesado (comentario de ZalemCitizen ).
Referencias:
- Mensajería entre documentos
- Ventana.postMessage()
- Puedo usar
