El objeto de ventana es el objeto de nivel superior en el modelo de objetos del navegador JavaScript y contiene múltiples métodos y propiedades comunes:
1 Abrir nueva ventana
Copie el código de código de la siguiente manera:
ventana.abierta(páginaURL,nombre,parámetros)
en:
pageURL es la ruta de la ventana secundaria
el nombre es el identificador de la ventana secundaria
Los parámetros son parámetros de ventana (cada parámetro está separado por comas)
como:
Copie el código de código de la siguiente manera:
window.open("http://www.cnblogs.com/zhouhb/","open",'height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars= no,resizable=no,ubicación=no,estado=no');
2 Abra la ventana modal
Copie el código de código de la siguiente manera:
window.showModalDialog("http://www.cnblogs.com/zhouhb/","open","toolbars=0;width=200;height=200");
3 Cierre la ventana sin que aparezca el cuadro de aviso.
Si la página web no se abre a través de un programa de script (window.open()), antes de llamar al script window.close() para cerrar la ventana, el objeto window.opener debe establecerse en nulo; de lo contrario, el navegador (IE7, IE8) aparecerá un mensaje emergente Aceptar y cerrar el cuadro de diálogo.
Copie el código de código de la siguiente manera:
<lenguaje de escritura="javaScript">
función cerrar ventana()
{
ventana.opener = nulo;
ventana.open('', '_self', '');
ventana.cerrar();
}
</script>
<tipo de entrada='botón' valor='Cerrar ventana' onClick="cerrarWindow()">
o
<input type="botón" value="Cerrar ventana" onClick="window.opener = null;
ventana.open('', '_self', '');ventana.close()">
Para cerrar la ventana del marco
Copie el código de código de la siguiente manera:
<lenguaje de escritura="javaScript">
función cerrar ventana()
{
ventana.opener = nulo;
ventana.open('', '_top', '');
ventana.parent.close();
}
</script>
4 uso de objetos de ubicación
Copie el código de código de la siguiente manera:
window.location.reload();//Actualizar la página actual
window.location.href="http://www.cnblogs.com/zhouhb/" //Cargar otras páginas
5 Uso del objeto histórico
Copie el código de código de la siguiente manera:
ventana.historia.go(1); //Adelante
ventana.historia.go(-1); //Volver
6 El formulario secundario pasa valores al formulario principal
6.1 Método sencillo
(1) Abra el subformulario en el formulario principal
Copie el código de código de la siguiente manera:
var str=window.showModalDialog("s.html");
si(cadena!=nulo)
{
var v=document.getElementById("v");
v.valor+=cadena;
}
(2) Código de subformulario
Copie el código de código de la siguiente manera:
var v=document.getElementById("v");
ventana.parent.returnValue=v.valor;
ventana.cerrar();
Además, para la ventana abierta por showModalDialog, también puede pasar valores a través de dialogArguments:
Código de ventana principal:
Copie el código de código de la siguiente manera:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transicional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<cabeza>
<meta http-equiv="Tipo de contenido" content="text/html; charset=utf-8" />
<título>Documento sin título</título>
<tipo de script="texto/javascript">
función diálogo abierto()
{
window.showModalDialog("child.html",window,"win","resable=false");//Aquí el objeto de ventana se pasa como parámetro
}
</script>
</cabeza>
<cuerpo>
<formulario>
<tipo de entrada="texto" id="nombre" />
<tipo de entrada="botón" id="abrir" valor="abrir" onclick="opendialog()"/>
</formulario>
</cuerpo>
</html>
Código de subventana:
Copie el código de código de la siguiente manera:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transicional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<cabeza>
<meta http-equiv="Tipo de contenido" content="text/html; charset=utf-8" />
<título>Documento sin título</título>
<tipo de script="texto/javascript">
función actualizarPadre()
{
var pwin=window.dialogArguments;//La ventana secundaria obtiene los parámetros pasados
si(pwin!=indefinido)
{
pwin.document.getElementById("nombre").value=document.getElementById("nombre").value;
}
}
</script>
</cabeza>
<cuerpo>
<formulario>
<tipo de entrada="texto" id="nombre" />
<input type="botón" id="actualizar" valor="Actualizar ventana principal" onclick="updateParent()"/>
</formulario>
</cuerpo>
</html>
Para la ventana abierta por showModalDialog, también puedes pasar el valor a través de window.returnValue:
Ventana principal:
Copie el código de código de la siguiente manera:
<tipo de SCRIPT="texto/javascript">
función abrirVentana(){
var bankCard=window.showModalDialog("counter.html","","dialogWidth=400px;dialogHeight=200px");
alert("La contraseña de su tarjeta bancaria es "+bankCard+"/n");
}
</SCRIPT>
(2) Abrir ventana
Copie el código de código de la siguiente manera:
<CABEZA>
<META http-equiv="Tipo de contenido" content="text/html; charset=gb2312">
<TITLE>Ejercicios de ventana</TITLE>
<SCRIPT tipo="texto/javascript" idioma="javascript">
función cerrarVentana(){
window.returnValue=document.myform.cardPass.value;
ventana.cerrar();
}
</SCRIPT>
</CABEZA>
<CUERPO>
<FORM nombre="miformulario" acción="" método="publicación">
Información de la cuenta:<BR>
Mantenga la información de su cuenta correctamente para evitar pérdidas<BR>
Número de cuenta: <INPUT name="cardNum" type="text" size="40"><BR>
Contraseña: <ENTRADA nombre="cardPass" tipo="contraseña" tamaño="45"><BR>
<ENTRADA tipo="botón" nombre="btn" valor="Confirmar" onClick="cerrarVentana()">
</FORM>
</CUERPO>
6.2 Una introducción más detallada
Como todos sabemos, la función window.open() se puede usar para abrir una nueva ventana, entonces, ¿cómo pasar el valor al formulario principal en el formulario secundario? De hecho, ¿puede obtener la referencia del formulario principal a través de la ventana? .abrelatas.
Por ejemplo, si creamos un nuevo formulario FatherPage.htm:
Copie el código de código de la siguiente manera:
<tipo de script="texto/javascript">
funciónOpenChildWindow()
{
ventana.open('ChildPage.htm');
}
</script>
<tipo de entrada="texto" id="txtInput" />
<tipo de entrada="botón" valor="OpenChild" onclick="OpenChildWindow()" />
Luego, en ChildPage.htm, puede acceder a los elementos del formulario principal a través de window.opener:
Copie el código de código de la siguiente manera:
<tipo de script="texto/javascript">
función EstablecerValor()
{
ventana.opener.document.getElementById('txtInput').valor
=document.getElementById('txtInput').valor;
ventana.cerrar();
}
</script>
<tipo de entrada="texto" id="txtInput" />
<tipo de entrada="botón" valor="SetFather" onclick="SetValue()" />
De hecho, al abrir el subformulario, también podemos asignar valores a los elementos del subformulario, porque la función window.open también devolverá una referencia al subformulario, por lo que FatherPage.htm se puede modificar como:
Copie el código de código de la siguiente manera:
<tipo de script="texto/javascript">
funciónOpenChildWindow()
{
var niño = ventana.open('ChildPage.htm');
child.document.getElementById('txtInput').valor
=document.getElementById('txtInput').valor;
}
</script>
<tipo de entrada="texto" id="txtInput" />
<tipo de entrada="botón" valor="OpenChild" onclick="OpenChildWindow()" />
Al determinar si la referencia del subformulario está vacía, también podemos controlarlo para que abra solo un subformulario:
Copie el código de código de la siguiente manera:
<tipo de script="texto/javascript">
var niño
funciónOpenChildWindow()
{
si(!niño)
niño = ventana.open('ChildPage.htm');
child.document.getElementById('txtInput').valor
=document.getElementById('txtInput').valor;
}
</script>
<tipo de entrada="texto" id="txtInput" />
<tipo de entrada="botón" valor="OpenChild" onclick="OpenChildWindow()" />
Esto por sí solo no es suficiente. Al cerrar el formulario secundario, la variable secundaria del formulario principal también debe borrarse. De lo contrario, el formulario secundario no se puede volver a abrir después de abrirlo y luego cerrarlo.
Copie el código de código de la siguiente manera:
<cuerpo onunload="Descargar()">
<tipo de script="texto/javascript">
función EstablecerValor()
{
ventana.opener.document.getElementById('txtInput').valor
=document.getElementById('txtInput').valor;
ventana.cerrar();
}
funciónDescargar()
{
ventana.opener.child=null;
}
</script>
<tipo de entrada="texto" id="txtInput" />
<tipo de entrada="botón" valor="SetFather" onclick="SetValue()" />
</cuerpo>