Comentario: Si desea lograr la transmisión de mensajes de documento cruzado, primero debe escuchar el evento de mensaje del objeto de la ventana y luego usar el método PostMessage () del objeto Window para enviar mensajes a otras ventanas. A continuación, presentemos en detalle. Los amigos interesados pueden referirse a él.
Escuche el evento de mensaje del objeto de la ventanaWindow.adDeventListener ("Mensaje", function (Event) {
// manejar el código de programa
}, FALSO);
Use el método PostMessage () del objeto Window para enviar mensajes a otros Windows. La definición de este método es la siguiente:
Otrowindow.PostMessage (mensaje, TargetOrigin);
Este método utiliza dos parámetros: el primer parámetro es el texto del mensaje enviado, pero también puede ser cualquier objeto JavaScript (el objeto se convierte en texto a través de JSON); El segundo parámetro es la dirección de URL de la ventana del objeto que recibe el mensaje. Puede usar comodín * para especificar todas las direcciones en la cadena de dirección de URL, pero se recomienda utilizar una dirección URL precisa. OtraWindow es una referencia al objeto de la ventana que se enviará. Puede devolver el objeto a través del método Window.open () o devolver el objeto de la ventana atribuido a una sola marco especificando un número de secuencia (índice) o nombre en la matriz Window.frames.
Ejemplo
<! Doctype html>
<html>
<Evista>
<meta charset = "utf-8"/>
<title> Muestra del documento principal para la transferencia de mensajes de discomplemento </title>
<script type = "text/javaScript" src = "http://code.jquery.com/jquery-1.6.4.min.js"> </script>
<script type = "text/javaScript">
$ (function () {
// Escuchar eventos de mensajes.
Window.adDeventListener ("Mensaje", function (Event) {
// Ignorar los mensajes enviados por páginas distintas de la URL especificada.
if (event.origin! = "http://www.blue-butterfly.net") return;
alerta (event.data); // Mostrar mensaje.
}, FALSO);
$ ("#iframeContent"). Load (function (evento) {
// Enviar un mensaje a la subpaga
este [0] .PostMessage ("Hola", "http://www.blue-butterfly.net/test/");
});
});
</script>
</ablo>
<Body>
<Header>
<h1> Sección de comunicación de dominio cruzado </h1>
</Header>
<iframe src = "http://www.blue-butterfly.net/test/"> </iframe>
</body>
</html>
El código en la subpaga es el siguiente:
<! Doctype html>
<html>
<Evista>
<meta charset = "utf-8"/>
<script type = "text/javaScript" src = "http://code.jquery.com/jquery-1.6.4.min.js"> </script>
<script type = "text/javaScript">
$ (function () {
Window.adDeventListener ("Mensaje", function (Event) {
if (event.origin! = "http: // lulingniu") return;
$ ("#console"). append (event.origin) .append ("mensaje de:") .append (event.data);
// Envía un mensaje a la página principal.
event.source.postMessage ("Hola, hay:" + this.location, event.origin);
}, FALSO);
});
</script>
</ablo>
<Body>
<p> Esto es lo que está en el iframe. </p>
<div> </div>
</body>
</html>
• Al escuchar el evento de mensaje del objeto de la ventana, puede recibir mensajes.
• Al acceder a la propiedad de origen del evento de mensajes, puede obtener la fuente de envío del mensaje (en este ejemplo, la fuente de envío de la página principal es y la fuente de envío de la subpensa es). Nota: La dirección de URL de la fuente de envío y el sitio web no son el mismo concepto. La fuente de envío solo incluye el nombre de dominio y el número de puerto. Para no recibir mensajes enviados maliciosamente por otras fuentes, es mejor verificar la fuente de envío.
• Al acceder al atributo de datos del evento del mensaje, se puede obtener el contenido del mensaje (puede ser cualquier objeto JavaScript, usando JSON).
• Enviar mensajes utilizando el método PostMessage ().
• Al acceder a la propiedad de origen del evento de mensaje, puede obtener el objeto proxy de la ventana de la fuente del mensaje.