O exagero de ter que capturar e testar cada pressionamento de tecla para a tecla ENTER realmente me incomoda, então minha solução depende do seguinte comportamento do navegador:
Pressionar ENTER disparará um evento de clique no botão enviar (testado no IE11, Chrome 38, FF 31) ** (ref: http://mattsnider.com/how-forms-submit-when-pressing-enter/ )
Portanto, minha solução é remover o botão de envio padrão (ou seja <input type="submit">
) para que o comportamento acima falhe porque não há botão de envio para clicar magicamente quando pressionar ENTER. Em vez disso, eu uso um manipulador de cliques do jQuery em um botão regular para enviar o formulário pelo .submit()
método do jQuery .
<form id="myform" method="post">
<input name="fav_color" type="text">
<input name="fav_color_2" type="text">
<button type="button" id="form-button-submit">DO IT!</button>
</form>
<script>
$('#form-button-submit').click(function(){
$('#myform').submit();
});
</script>
Demonstração: http://codepen.io/anon/pen/fxeyv?editors=101
** esse comportamento não é aplicável se o formulário tiver apenas 1 campo de entrada e esse campo for uma entrada de 'texto'; nesse caso, o formulário será enviado com a tecla ENTER, mesmo que nenhum botão de envio esteja presente na marcação HTML (por exemplo, um campo de pesquisa). Esse é o comportamento padrão do navegador desde os anos 90.