Foros del Web - Ver Mensaje Individual - ¿Cómo escribir código javascript dentro de una nueva ventana creada con javascript??

emprear · #11 (**permalink**) 16/04/2013, 20:19

Tenés muchas posibilidades. Lo primero que te recomiendo, e que para generar el código javascript utilices esta herramienta

http://foros.emprear.com/javascript/...s/html2js.html

Aqui un ejemplo
la ventana padre

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es-ar">
<head>
<meta charset="utf-8" />
<title>Generar ventana javascript</title>
<script type="text/javascript">
//<![CDATA[
var nventana= null;
function nvf(){
var winleft = (screen.width-600)/2;
var wintop = (screen.height-250)/2;
nventana = window.open('','nombreVentana','toolbar=no,location=no,top='+wintop+',left='+winleft+',scrollbars=no,status=no,width=700,height=450');
var strVar="";
strVar += "<!DOCTYPE html>";
strVar += "<html lang=\"es-ar\">";
strVar += "<head>";
strVar += "<meta charset=\"utf-8\" \/>";
strVar += "<title>NuevaVentana<\/title>";
strVar += "<link rel=\"stylesheet\" type=\"text\/css\" href=\"estilos.css\" media=\"screen\" \/>";
strVar += "<style type=\"text\/css\">";
strVar += ".verde{";
strVar += "background:green;";
strVar += "}";
strVar += "<\/style>";
strVar += "<script type=\"text\/javascript\">";
strVar += "function cambiarColor(){";
strVar += "document.getElementById(\"roja\").style.background = \"blue\";";
strVar += "}";
strVar += "<\/script>";
strVar += "<script type=\"text\/javascript\" src=\"fncs.js\"><\/script>";
strVar += "<\/head>";
strVar += "<body>";
strVar += "<div id=\"contenedor\">";
strVar += "<input type=\"button\" value=\"Cerrar la nueva ventana\" onclick=\"self.close();\" \/><br \/>";
strVar += "<input type=\"button\" value=\"Cambiar Roja por Azul\" onclick=\"cambiarColor();\" \/><br \/>";
strVar += "<input type=\"button\" value=\"Cambiar fondo del opener a lime con una función definida en el mismo\" onclick=\"opener.cambiaFondo();\" \/><br \/>";
strVar += "<input type=\"button\" value=\"Poner un nombre en en el campo de texto inferior utilizando una función en un archivo externo (fncs.js)\" onclick=\"cambiaNombre();\" \/><br \/>";
strVar += "<\/div>";
strVar += "<div class=\"verde\">verde<\/div>";
strVar += "<div id=\"roja\">roja<\/div>";
strVar += "Nombre: <input type=\"text\" value=\"\" id=\"nombre\" \/><br \/>";
strVar += "Número: <input type=\"text\" value=\"\" id=\"numero\" \/>";
strVar += "<\/body>";
strVar += "<\/html>";
nventana.document.write(strVar);
}
 
function cambiaFondo(){
document.body.style.background = "lime";
}
function valor_a_hija(n){
if(parseInt(navigator.appVersion) >= 4){nventana.window.focus();}
nventana.document.getElementById('numero').value = n;
}
 
//]]>
</script>
</head>
<body>
<button onclick="nvf();">Generar nueva ventana</button><br />
<button onclick="valor_a_hija(25);">Pasar número a hija (presionar primero el botón anterior para generar la ventana</button><br />
<button onclick="nvf();setTimeout('valor_a_hija(50)',5000);">Crear ventana hija y pasarle un número (cerrar la nueva ventana si está abierta),<br />
utilizamos setTimeuot para pasar el valor para dar tiempo a que se genere la ventana</button>
</body>
</html>

el css externo llamado en la ventana hija
estilos.css

Código CSS:

Ver original#roja{
background: red;
}

el js externo llamado en la ventana hija
fncs.js

Código Javascript:

Ver originalfunction cambiaNombre(){
document.getElementById("nombre").value = "Emprear";
}

Demo funcionando
http://foros.emprear.com/javascript/...r_ventana.html

Esto sería lo básico, hay muchas otras variantes.
Es importante que el html con el que vas a crear la nueva ventana esté bien hecho,
Saludos