2008-09-17 13 views
60

Tengo una página que genera una ventana del navegador emergente. Tengo una variable de JavaScript en la ventana principal del navegador y me gustaría pasarla a la ventana emergente del navegador.¿Puedo pasar una variable de JavaScript a otra ventana del navegador?

¿Hay alguna manera de hacerlo? Sé que esto se puede hacer a través de marcos en la misma ventana del navegador, pero no estoy seguro si se puede hacer a través de las ventanas del navegador.

Respuesta

38

Si las ventanas son del mismo dominio de seguridad, y tiene una referencia a la otra ventana, sí.

El método de apertura() de Javascript devuelve una referencia a la ventana creada (o ventana existente si reutiliza una existente). Cada ventana creada de tal manera obtiene una propiedad aplicada a ella "window.opener" apuntando a la ventana que lo creó.

Cualquiera puede entonces utilizar el DOM (dependiendo de seguridad) para acceder a las propiedades de la otra, o sus documentos, cuadros, etc.

+12

Las cosas han cambiado desde que se hizo esta pregunta. Ahora también es posible, en [navegadores más nuevos] (http://caniuse.com/#feat=x-doc-messaging), pasar mensajes entre ventanas en un dominio de seguridad * diferente *, a través de llamadas a 'window.postMessage '. – Brian

-2

La función window.open() también permitirá esto si tiene una referencia a la ventana creada, siempre que esté en el mismo dominio. Si la variable se usa en el lado del servidor, debe usar una variable $ _SESSION (suponiendo que esté usando PHP).

1

Sí, se puede hacer siempre y cuando ambas ventanas están en el mismo dominio. La función window.open() devolverá un manejador a la nueva ventana. La ventana secundaria puede acceder a la ventana primaria usando el elemento "abridor" del elemento DOM.

0

O bien, puede agregarlo a la URL y dejar que el lenguaje de scripts (PHP, Perl, ASP, Python, Ruby, lo que sea) lo maneje en el otro lado. Algo así como:

var x = 10; 
window.open('mypage.php?x='+x); 
2

En la ventana de su padre:

var yourValue = 'something'; 
window.open('/childwindow.html?yourKey=' + yourValue); 

Luego, en childwindow.html:

var query = location.search.substring(1); 
var parameters = {}; 
var keyValues = query.split(/&/); 
for (var keyValue in keyValues) { 
    var keyValuePairs = keyValue.split(/=/); 
    var key = keyValuePairs[0]; 
    var value = keyValuePairs[1]; 
    parameters[key] = value; 
} 

alert(parameters['yourKey']); 

No es potencialmente una gran cantidad de comprobación de errores que usted debe hacer en el análisis de tus pares clave/valor pero no lo estoy incluyendo aquí. Tal vez alguien pueda proporcionar una rutina de análisis de cadena de consulta Javascript más inclusiva en una respuesta posterior.

80

poner el código de la materia, puede hacerlo desde la ventana padre:

var thisIsAnObject = {foo:'bar'}; 
var w = window.open("http://example.com"); 
w.myVariable = thisIsAnObject; 

o esto desde la nueva ventana:

var myVariable = window.opener.thisIsAnObject; 

prefiero este último, ya que es probable que necesite esperar a que se cargue la nueva página de todos modos, para que pueda acceder a sus elementos, o lo que quiera.

+0

no entiendo {foo: 'bar'}. ¿podría ayudarme en esto? –

+1

@MasoudSahabi, 'var x = {foo: 'bar'}' es solo una sintaxis literal compacta para crear un objeto. Es lo mismo que 'var x = new Object(); x.foo = 'bar'; ' – sergiopereira

+0

Estoy usando el primero y funciona bien en Chrome, pero IE parece quejarse. Y es muy difícil lograr un punto de quiebre para golpear. – styfle

7

Sí, las secuencias de comandos pueden acceder a las propiedades de otras ventanas en el mismo dominio que tienen un control (generalmente obtenido a través de window.open/opener y window.frames/parent). Por lo general, es más manejable llamar a las funciones definidas en la otra ventana en lugar de manipular las variables directamente.

Sin embargo, las ventanas pueden morir o seguir adelante, y los navegadores lo solucionan de forma diferente cuando lo hacen. Compruebe que una ventana (a) aún esté abierta (! Window.closed) y (b) tenga la función que espera que esté disponible antes de intentar llamarla.

Los valores simples como cadenas están bien, pero en general no es una buena idea pasar objetos complejos como funciones, elementos DOM y cierres entre ventanas. Si una ventana secundaria almacena un objeto de su abrelatas, entonces el abridor se cierra, ese objeto puede volverse 'muerto' (en algunos navegadores como IE) o causar una pérdida de memoria. Errores extraños pueden sobrevenir.

-1

Sí navegadores borrar todos los ref. por una ventana Por lo tanto, debe buscar un ClassName de algo en la ventana principal o usar cookies como JavaScript ref.

Tengo una radio en la página de mi proyecto. Y luego enciendes para que la radio comience en una ventana emergente y yo controlo los enlaces de la ventana principal en la página principal y muestro el estado de reproducción y en FF es fácil pero en MSIE no es tan fácil en absoluto. Pero puede hacerse.

3

las variables que pasan entre las ventanas (si las ventanas están en el mismo dominio) se puede hacer fácilmente a través de:

  1. Galletas
  2. localStorage. Solo asegúrese de que su navegador admita localStorage, y haga el mantenimiento variable derecho (agregar/eliminar/eliminar) para mantener limpio localStorage.
2

Puede pasar variables, y la referencia a las cosas en la ventana padre con bastante facilidad:

// open an empty sample window: 
var win = open(""); 
win.document.write("<html><body><head></head><input value='Trigger handler in other window!' type='button' id='button'></input></body></html>"); 

// attach to button in target window, and use a handler in this one: 
var button = win.document.getElementById('button'); 

button.onclick = function() { 
    alert("I'm in the first frame!"); 
} 
+0

Como está escrito, esto no funcionará en el mundo real donde las personas ejecutan adblock, etc. Al agregar parámetros al abierto para que se abra en una ventana separada (en lugar de pestaña, como tengo configurado FF) pude para hacer que esto funcione en Firefox. Pero la ventana emergente estaba bloqueada en Chrome. Por lo tanto, es simple y tipo de trabajos, pero está un poco lejos de ser una solución viable. –

0

he tenido problemas para pasar con éxito los argumentos a la nueva ventana abierta.
Esto es lo que ocurrió:

function openWindow(path, callback /* , arg1 , arg2, ... */){ 
    var args = Array.prototype.slice.call(arguments, 2); // retrieve the arguments 
    var w = window.open(path); // open the new window 
    w.addEventListener('load', afterLoadWindow.bind(w, args), false); // listen to the new window's load event 
    function afterLoadWindow(/* [arg1,arg2,...], loadEvent */){ 
     callback.apply(this, arguments[0]); // execute the callbacks, passing the initial arguments (arguments[1] contains the load event) 
    } 
} 

Ejemplo de llamada:

openWindow("/contact",function(firstname, lastname){ 
    this.alert("Hello "+firstname+" "+lastname); 
}, "John", "Doe"); 

ejemplo vivo

http://jsfiddle.net/rj6o0jzw/1/

0

Puede utilizar window.name como un tran datos deporte entre ventanas, y también funciona de forma cruzada. No es oficialmente compatible, pero desde mi entender, en realidad funciona muy bien el navegador cruzado.

More info here on this Stackoverflow Post

1

Uno puede pasar un mensaje desde la ventana 'padres' de la ventana 'niño':

en la 'ventana padre' abrir el niño

var win = window.open(<window.location.href>, '_blank');  
     setTimeout(function(){ 
        win.postMessage(SRFBfromEBNF,"*") 
        },1000); 
    win.focus(); 

el estar reemplazado según el contexto

En el 'niño'

window.addEventListener('message', function(event) { 
     if(event.srcElement.location.href==window.location.href){ 
     /* do what you want with event.data */ 
     } 
    }); 

La prueba if se debe cambiar de acuerdo con el contexto

Cuestiones relacionadas