forms internet-explorer-8 enter

forms - En IE8 enter key en un formulario no funciona



internet-explorer-8 (14)

Boleto viejo, pero me gustaría agregar lo que creo que es la explicación:

IE8 hace lo siguiente: la tecla Intro enviará el formulario, pero cualquier

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

No será enviado en el POST.

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

Espero que esto ayude...

Tengo un problema que en IE8 el ingreso 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 desactiva los resultados que el botón de entrada ya no activa un envío. ¿Es esto un error en IE8 o es un problema de seguridad?

El código para reproducir esto 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>


Creo que Yasin tiene el punto. Acabo de tener el mismo problema: varios campos de texto dentro de un formulario cuya visibilidad está "oculta". Mi solución (para evitar que el formulario parpadee) 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 que arreglar con JS.


Creo que todo es mucho más complicado de lo que crees ...

cuando el valor de visualización de un formulario se establece en ninguno con una clase css o solo con un atributo de estilo en la página inicial, presionar 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 que funciona bien ... si tiene más de uno, no se activa el envío de formularios ...

Aquí hice una demo ...

Funciona bien (forma normal) http://yasinergul.com//ie8-enter-key-bug/one.html

Funciona bien (el formulario está oculto y se vuelve visible, pero con una entrada de texto) http://yasinergul.com//ie8-enter-key-bug/two.html

No funciona (el formulario está oculto y se vuelve visible, pero con dos entradas de texto) http://yasinergul.com//ie8-enter-key-bug/three.html

Creo que el mejor enfoque es dar una clase .hidden al objeto pero no configurar la visualización: ninguna para este selector css. Puedes ocultarlo con jquery como

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

a medida que la página se carga, el formulario se muestra durante milisegundos, pero se oculta después de que funciona jquery ...


Encontré una solución de trabajo.

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

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


Es posible que desee agregar un evento onkeyup a sus cuadros de entrada, de modo que si presiona ingresar en el cuadro de entrada, también se enviará.

Como mencionó CodePartizan, necesita enfocarse en el botón, de lo contrario, así que si presiona el botón o lo presiona, parece que también funciona para mí.



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

En lugar de usar <input type="submit...> , use <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>


Lo probé en IE8 y funciona para mí. Sin embargo, debes asegurarte de que parte del formulario esté enfocado.

Javascript tiene una función de enfoque que puede usar para establecer el enfoque si eso es lo que necesita.

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


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

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

Otros navegadores, incluidos IE 7 (o incluso IE 8 que utilizan el modo de compatibilidad estándar de IE 7) no tienen problemas.

He resuelto el problema yo solo usando height: 0px; en el CSS, luego de tener javascript establecer la altura adecuada cuando quiero mostrar el formulario. Usando la altura en su lugar, el comportamiento predeterminado para enviar la clave parece funcionar normalmente.


Para los futuros usuarios que se topan con esta pregunta:

Lo que funcionó para mí fue agregar un DOCTYPE:

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


Sí, también fui mordido por este error hoy. Sin embargo, encontré esta solución alternativa (a diferencia del OP):

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

Simplemente recrear los contenidos del formulario a partir de los contenidos de sí mismo. Yikes Pero funciona. (Últimas palabras famosas...)



Una solución a lo que sugirió @Jitendra Pancholi: ahora solo presenta la forma que queremos, no todas.

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