2009-09-15 5 views
23

Tengo un problema que en IE8 la entrada no funciona para enviar un formulario. He generado una página de prueba para exponer este problema. Parece que mostrar el formulario en la función onLoad deshabilita los resultados de que el ingrese el botón ya no activa un envío. ¿Es esto un error en IE8 o es un problema de seguridad?En IE8 ingrese la clave en un formulario que no funciona

El código para reproducir este es:

onload = function() { 
 
    document.getElementById('test').style.display = 'block'; 
 
}
#test { 
 
    display: none; 
 
}
<form id="test" method="get" action="javascript:alert('woei!')"> 
 
    <input type="text" name="user" value=""> 
 
    <input type="password" name="pw" value=""> 
 
    <input type="submit" value="submit" id="submit"> 
 
</form>

+2

+1 por claridad ... algo raro últimamente. – madcolor

+0

dupe: http://stackoverflow.com/questions/964734/hitting-enter-does-not-post-form-in-ie8 –

Respuesta

0

Lo he probado en IE8 y funciona para mí. Sin embargo, debes asegurarte de que parte del formulario tenga foco.

Javascript tiene una función de enfoque que se puede utilizar para ajustar el enfoque si eso es lo que necesita.

var textbox = document.getElementById("whatever name input box's id will be"); 
if(textbox) textbox.focus(); 
+0

Sí, por alguna extraña razón cuando lo abro como un archivo local no me sale para elegir si usar compatibilidad y funciona. Ingreso en IIS y luego me deja elegir no nos compatabilidad y veo el comportamiento que describes. Extraño . . . – CodePartizan

0

Es posible que desee añadir un evento onkeyup a sus cuadros de entrada de manera que si se golpea un escriba en el cuadro de entrada entonces será también enviar.

Como se mencionó CodePartizan, se necesita el foco en el botón de otro modo, por lo que si pestaña hacia el botón, o hace clic en él, parece que funciona para mí también.

4

No puedo decir si se trata de un error exactamente, pero puedo confirmar que el comportamiento que informe ha cambiado en IE 8 ... y me imagino que es probablemente un error, no un cambio deliberado.

Si el formulario está configurado con la pantalla CSS: ninguno el comportamiento del botón de envío predeterminado no funciona.

Otros navegadores, incluyendo IE 7 (o incluso IE 8 utilizando IE 7 modo de compatibilidad estándar) no tienen problemas.

he trabajado todo el problema mismo sólo por el uso altura: 0px; en el CSS, luego tener javascript establecer la altura adecuada cuando quiero mostrar el formulario. Con el uso de la altura, el comportamiento de envío predeterminado de la tecla Intro parece funcionar normalmente.

13

He encontrado una solución adecuada y quería compartirla con ustedes.

En lugar de utilizar <input type="submit...>, utilice <button type="submit"...>. Esto hará exactamente lo mismo en los otros navegadores (IE6-7, FF3) Y funciona en IE8. :)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<style type="text/css"> 
#test { 
    display: none; 
} 
</style> 
<script type="text/javascript"> 
onload = function() { 
    document.getElementById('test').style.display = 'block'; 
}; 
</script> 
</head> 
<body> 
<form id="test" method="get" action="javascript:alert('woei!')"> 
    <input type="text" name="user" value="" /> 
    <input type="password" name="pw" value="" /> 
    <button type="submit" value="submit" id="submit"></button> 
</form> 
</body> 
</html> 
+0

No funciona en IE 9 :-( –

+2

No veo que esto funcione en IE 8. Todavía obtengo el valor "nulo" en el otro extremo. Es más fácil probar solo "if (submit ==" submit "| | submit == null) ", suponiendo que" null "significa que presionan" ENTER "en IE 8 o 9. – James

6

Creo Todo es mucho más complicado de lo que piensa ...

cuando el valor de la pantalla de un formulario se establece en ninguno con una clase CSS o simplemente con un atributo de estilo en la página inicial, golpear la tecla Intro en un campo de texto no funciona solo si tiene más de un campo de entrada con tipo de texto ... si tiene un campo de texto, funciona bien ... si tiene más de uno, no activa el envío de formularios. ..

Aquí hice una demostración ...

Obras fina (Forma Normal) http://yasinergul.com/stackoverflow/ie8-enter-key-bug/one.html

Obras fina (forma oculta & un retroceso visible pero es con una entrada de texto) http://yasinergul.com/stackoverflow/ie8-enter-key-bug/two.html

no funciona (forma oculta & situado detrás visibles pero es con dos entradas de texto) http://yasinergul.com/stackoverflow/ie8-enter-key-bug/three.html

Creo que el mejor enfoque es dar una clase .hidden al objeto pero no establecer dis play: ninguno para este selector css. usted puede hacer que oculta con jQuery como

$(".hidden").hide();

que la página se carga el formulario se muestra de milisegundos, pero se oculta tras jQuery funciona ...

+0

Hay un bonito escrito sobre esto en: http://www.thefutureoftheweb.com/blog/ submit-a-form-in-ie-with-enter – nachtigall

0

creo Yasin tiene el punto. Acabo de tener el mismo problema: campos de texto múltiples dentro de un formulario cuya visibilidad está "oculta". Mi solución alternativa (para evitar que el formulario destelle) es establecer la opacidad del formulario en 0 en el CSS y luego personalizar su configuración de estilo con jQuery en el documento listo.

Creo que esto no es algo para solucionar con JS.

0

Sí, hoy también fui mordido por este error. He encontrado esta solución, aunque (diff de la OP):

<script type="text/javascript"> 
onload = function() { 
    document.getElementById('test').style.display = 'block'; 
+ document.getElementById('test').innerHTML = 
+  document.getElementById('test').innerHTML; 
} 
</script> 
</head> 

Simplemente vuelva a crear el contenido de la forma del contenido del mismo. Yikes. Pero funciona. (famosas últimas palabras ...)

1

billete antiguo, pero me gustaría añadir lo que creo que es la explicación:

IE8 hace lo siguiente detalle curioso: la tecla Intro presentará el formulario, pero cualquier

<input type="submit" name="MySubmitButton" value="I hope I detect THIS VALUE in POST" /> 

no se enviarán en el POST.

IE9 cambia el comportamiento y envía el valor. Chrome siempre ha enviado el valor, en la medida en que lo hayan demostrado mis pruebas.

espero que esto ayude ...

9
$("form input").keypress(function (e) { 
    if(e.which === 13) { 
     $("form").submit(); 
    } 
}); 

Por encima es una solución adecuada. Ref: IE Not submitting my form on enter press of enter key?

+0

que lo hizo por mí, probablemente no sea la mejor solución, pero funciona, bien hecho, +1 –

0

Esto funciona para mí en IE8. Tuve este problema cuando uso solo un campo de entrada.

Leer más: http://www.rachaelarnold.com/dev/archive/enter-key-form-submission-bug#ixzz2Y5Zwgj2k

+0

Tenga en cuenta que las respuestas de solo enlace no se recomiendan, entonces las respuestas deberían ser el final -punto de una búsqueda de una solución (frente a otra escala de referencias, que tiende a quedarse obsoleto en el tiempo). Considere agregar una sinopsis independiente aquí, manteniendo el enlace como referencia. – kleopatra

1

Para cualquier futuros usuarios de tropezar con esta pregunta:

Lo que funcionó para mí fue la adición de un DOCTYPE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

1

Una solución a lo @Jitendra Pancholi suggested- ahora se somete solamente la forma que queremos, no todos ellos

$("form input").keypress(function (e) { 
    if(e.which === 13) { 
     $(this.form).submit(); 
    } 
}); 
0

encontrado una solución de trabajo.

Haga que el botón de envío sea invisible en lugar de usar display: ninguno;

input#submit { 
color: transparent; 
background: transparent; 
border: 0px; 
} 
Cuestiones relacionadas