1. ¿Qué es Modaldialog?
ShowModaldialog es un método de objeto JSWindow.
La diferencia es: después de que se abre el showModaldialog, la ventana principal no puede obtener el enfoque (es decir, no se puede operar).
Puede establecer el valor de Window.returnValue en el subvinuto, para que la ventana principal pueda obtener este valor de retorno.
2. Un ejemplo
1) main.html en la ventana principal,
2) Abra el sub -window sub.html en la ventana principal a través de showmodaldialog
3) Establezca Valor de retorno en el subvinuto y regrese a la ventana principal para usar
main.html
Copiar código del código de la siguiente manera:
<html>
<Evista>
<Medaname = "Generator" Content = "Oscar999">
</ablo>
<script>
FunctionShowModal ()
{{
varret = window.showModalDialog ("sub.html? temp ="+math.random ());
Alerta ("SubreturnValueis"+ret);
}
</script>
<Body>
<Inputid = Button1Type = ButtonValue = "OpenSub" name = Button1OnClick = "showModal ();" >>
</body>
</Html>
sub.html
Copiar código del código de la siguiente manera:
<html>
<Evista>
<Medaname = "Generator" Content = "Oscar999">
</ablo>
<script>
FunctionReturnMain ()
{{
Window.returnValue = "returnFromsub";
window.close ();
}
</script>
<Body>
<Inputid = button1Type = buttonValue = "returnandClose" name = button1onClick = "returnmain ()">
</body>
</Html>
Explicación especial: Cuando el método de showmodaldialog en main.html, el propósito de usar math.random () es evitar caché.
3.ShowModaldialog en detalle
vreturnValue = window.showModaldialog (Surl [, varGuments] [, sfeatures]))
Súbdito
Debe -le el elección de los parámetros, escriba: cadena. URL utilizada para especificar el documento que se mostrará en el cuadro de diálogo.
Vargumentos
Parámetros opcionales, Tipo: Variante. Se usa para pasar parámetros al cuadro de diálogo. El tipo de parámetro pasado por no es limitado, incluida la matriz, etc. El cuadro de diálogo obtiene parámetros pasados a través de la ventana. Dialogargumentos.
sfeatures
Parámetros opcionales, escriba: cadena. Utilizado para describir la apariencia y otra información del cuadro de diálogo, puede usar uno o más a continuación y usar el segmento ";"
La altura del cuadro de diálogo de diálogo, no menos de 100px, diáloga y ancho de diálogo en IE4 son EM, e IE5 es PX.
Dialogwidth: cuadro de diálogo Ancho.
dialogleft: distancia desde la izquierda del escritorio.
Dialogtop: distancia desde el escritorio.
Centro: {SÍ |
Ayuda: {SÍ |
RESIZABLE: {SÍ | El no.
Estado: {Sí | El valor predeterminado es sí [modso] o no [modal].
Scroll: {Sí | El valor predeterminado es sí.
Hay varios atributos utilizados en HTA, que generalmente no se utilizan en las páginas web generales.
Dialoghide: {Sí | El valor predeterminado es no.
Edge: {Hunken | El valor predeterminado es el aumento.
sin adornos: {Sí |
4. Compatibilidad del navegador
Pero no todos los navegadores son compatibles con este uso.
Si ejecuta el ejemplo anterior en Chrome, la ventana principal puede obtener el enfoque a voluntad.
El siguiente es el soporte de los navegadores principales en este método.
| Navegador | Si apoyar | estado |
| IE9 | ○ | |
| Firefox13.0 | ○ | |
| safari5.1 | ○ | |
| Chrome19.0 | × | No es un cuadro de diálogo modal, pero Open tiene una nueva ventana |
| Ópera12.0 | × | Todo sucedió, ni siquiera una ventana |
Si hay un parámetro que se introduce en Vargumentos a la ventana:
Copiar código del código de la siguiente manera:
var return = window.showModalDialog ("sub.html? temp ="+math.random (), ventana);
En el subvinuto, el siguiente valor es:
| Navegador | Diálogo modal | ventana. | Window.dialogargumentos | Devolución de retorno |
| IE9 | ○ | indefinido | [Ventana de objeto] | ○ |
| Firefox13.0 | ○ | [ObjectWindow] | [ObjectWindow] | ○ |
| safari5.1 | ○ | [ObjectWindow] | [ObjectWindow] | ○ |
| Chrome19.0 | × | [ObjectWindow] | indefinido | × |
Tenga en cuenta que bajo el navegador Firefox, si la subdinuda está renovada, Window.dialogarguments aún se perderá y quedará indefinido. En los resultados anteriores, podemos ver que el valor de retorno de retorno es que solo el navegador Chrome regresa indefinido, y no hay problemas con otros navegadores.
5. Cómo resolver la compatibilidad de Chrome.
La dirección es: set window.opner.returnValue = "" "
main.html
Copiar código del código de la siguiente manera:
<html>
<Evista>
<Meta name = "general" content = "Oscar999">
</ablo>
<script>
Función showModal ()
{{
var return = window.showModalDialog ("sub.html? temp ="+math.random (), ventana);
// para Chrome
if (ret == indefinido)
{{
Ret = window.returnValue;
}
Alerta ("El valor de retorno sub"+ret);
}
</script>
<Body>
<Input id = button1 type = button valor = "abrir sub" name = button1 onClick = "showModal ();" >>
</body>
</Html>
sub.html
Copiar código del código de la siguiente manera:
<html>
<Evista>
<Meta name = "general" content = "Oscar999">
</ablo>
<script>
Function returnmain ()
{{
if (window.opner! = indefinido)
{{
Window.opner.returnValue = "return from sub";
} Demás {
Window.returnValue = "return from sub";
}
window.close ();
}
</script>
<Body>
<Input id = button1 type = button value = "return and close" name = button1 onClick = "returnmain ()">
</body>
</Html>
Esto es para determinar si ciertos objetos están definidos para distinguir los navegadores. Por supuesto, también puede juzgar el tipo de tipo de navegador
Esto se utiliza para usar el valor de retorno de la ventana principal.
Var OldValue = Window.ReturnValue;
var newValue = showModalDialog ()
Window.ReturnValue = OldValue
6. Cabe señalar que la prueba bajo Chrome necesita colocar el archivo HTML en el servidor web (Tomcat, ...) para acceder a la prueba bajo la URL HTTP. De lo contrario, no tendrá éxito.