Anular ENTER en formularios con JQuery

A quién no le ha pasado que mientras llenaba un formulario, presionó la tecla ENTER, ya sea por casualidad o por cualquier otra causa, y el formualrio se envió con la información incompleta, o errónea o simplemente le reportó error y le devolvió el formulario desde cero?

Cuántos no han querido arrancar la dichosa tecla, o matar a quien hizo el formulario por no anular la dichosa tecla y evitar un envío involuntario, o visto desde el otro lado del cristalab, cuántas veces has querido hacerlo y no has sabido cómo?: Aqui la solución!

Jquery, nos permite hacer esta gracia con unas cuantas líneas, utlizando los selectores de etiquetas y el método keypress(), mediante la combinación de éstos logramos que al presionar la tecla ENTER dentro del FORM o dentro un INPUT se vuelva un FALSE y de esta manera evitar que envíe SUBMIT.

Como keypress registra el valor de cada tecla, le asignamos a la función una variable, la cual recogerá el valor de la tecla presionada, luego este valor lo comparamos con el valor de la tecla ENTER que es 13, si es la comparación devuelve TRUE, entonces devuelve FALSE y así evitamos el envío del FORM al presionar la tecla ENTER.

Tal vez en palabras se vea un poco complicado asi que aquí les dejo el código, sólo implementenlo dentro del HEAD de su página y listo.

Código :

<script language="javascript" src="js/jquery.js"></script>
// remplaza el src por la ubicacion de tu jscript

<script language="javascript">
$(document).ready(function() {

  $('form').keypress(function(e){   
    if(e == 13){
      return false;
    }
  });

  $('input').keypress(function(e){
    if(e.which == 13){
      return false;
    }
  });

});
</script>

Espero les sea de utilidad

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.