Inhabilitar el envío del formulario mediante la tecla Intro en solo _algunos campos

Quiero conservar el comportamiento convencional de 'enviar formularios cuando pulso Entrar' porque los usuarios están familiarizados con. Pero, por reflejo, a menudo presionan enter cuando terminan con un cuadro de entrada de texto, pero antes de que realmente se terminen con la forma completa.Inhabilitar el envío del formulario mediante la tecla Intro en solo _algunos campos

Me gustaría secuestrar la tecla Enter solo cuando el foco está en cierta clase de entrada.

Buscando Related Questions esto se parece a lo que estoy buscando:

if (document.addEventListener) { 
    document.getElementById('strip').addEventListener('keypress',HandleKeyPress,false); 
} else { 
    document.getElementById('strip').onkeypress = HandleKeyPress; 
}

pero la parte if (document.addEventListener) { es desconocido para mí.

Fuente

2010-05-08 justSteve

Esto se llama detección de características. Si el navegador usa la sintaxis 'addEventListener()' para agregar oyentes de eventos, habrá un objeto de función llamado 'addEventListener' en cada objeto del nodo DOM (y específicamente, en el objeto del documento). Un objeto de función se convierte en verdadero cuando se convierte en un booleano, por lo que se ejecuta la primera rama. Si el navegador no comprende la sintaxis addEventListener, 'document.addEventListener' no estará definido (lo que se convierte en falso) y se ejecutará el código alternativo en la segunda rama. – Tgr

Aprecio mucho lo explicable. ¡Gracias! – justSteve

127

Puede capturar y cancelar el ingreso en keypress en esos campos como este:

$('.noEnterSubmit').keypress(function(e){ 
    if (e.which == 13) return false; 
    //or... 
    if (e.which == 13) e.preventDefault(); 
});

Luego, en sus entradas sólo les dan una class="noEnterSubmit" :)

De cara al futuro, en caso de que otros encontrar esta tarde, en jQuery 1.4.3 (no fuera todavía) se puede acortar a esto:

$('.noEnterSubmit').bind('keypress', false);

Fuente

2010-05-08 12:24:31

+46

También debe tener en cuenta que 'bind ('keypress', false);' _prohibirá toda entrada de datos_. Por lo tanto, si desea aplicar esto a elementos de entrada de texto, use la primera solución – hohner

Si está utilizando campos dinámicos, debe cambiar esto a '$ ('cuerpo'). On ('keypress', '.noEnterSubmit', función () {...}); ' – seangates

El uso de una clase no es apropiado para el control semántico. Mejor uso data-nosubmit o similar atributo de datos HTML 5 para el mismo. $ ('[data-nosubmit]') es el selector, entonces. –

para permitir Entra solo en una clase específica (en este ejemplo, 'enterSubmit'):

jQuery(document).ready(function(){ 
    jQuery('input').keypress(function(event){ 
     var enterOkClass = jQuery(this).attr('class'); 
     if (event.which == 13 && enterOkClass != 'enterSubmit') { 
      event.preventDefault(); 
      return false; 
     } 
    }); 
});

Fuente

2013-04-02 04:58:57

Sólo añadir siguiente código en <Head> etiqueta en el código HTML. Se enviará el formulario en la tecla Intro Para todos los campos en el formulario

<script type="text/javascript"> 
    function stopEnterKey(evt) { 
     var evt = (evt) ? evt : ((event) ? event : null); 
     var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); 
     if ((evt.keyCode == 13) && (node.type == "text")) { return false; } 
    } 
    document.onkeypress = stopEnterKey; 
</script>

Fuente

2013-05-27 11:57:40

Inhabilitar el envío del formulario mediante la tecla Intro en solo _algunos campos

Respuesta

Cuestiones relacionadas