Wyłączanie przesyłania formularzy za pomocą klawisza Enter tylko na niektórych polach

Chcę zachować tradycyjną formę wysyłaną po naciśnięciu klawisza Enter, ponieważ użytkownicy są zaznajomieni. Ale przez odruch, często trafiają enter, gdy kończą z polem wprowadzania tekstu - ale zanim zostaną faktycznie wykonane z pełnym formularzem.Wyłączanie przesyłania formularzy za pomocą klawisza Enter tylko na niektórych polach

Chciałabym przejąć klucz Enter tylko wtedy, gdy fokus dotyczy określonej klasy danych wejściowych.

Patrząc Related Questions to wygląda co szukam:

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

ale if (document.addEventListener) { część nie zna mnie.

Źródło

2010-05-08 justSteve

To się nazywa rozpoznawanie cech. Jeśli przeglądarka używa składni 'addEventListener()' do dodawania detektorów zdarzeń, w każdym obiekcie węzła DOM (a konkretnie w obiekcie dokumentu) pojawi się obiekt funkcji o nazwie 'addEventListener'. Obiekt funkcji staje się prawdziwy po przekonwertowaniu na wartość logiczną, więc uruchamiana jest pierwsza gałąź. Jeśli przeglądarka nie zrozumie składni addEventListener, "document.addEventListener" będzie niezdefiniowane (co spowoduje konwersję na wartość false), a kod zapasowy w drugiej gałęzi zostanie wykonany. – Tgr

Bardzo doceniam wyjaśnienie. dzięki! – justSteve

127

Można uchwycić i anulować wprowadzić keypress na tych polach tak:

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

Następnie na swoich wejściach tylko dać im class="noEnterSubmit" :)

Patrząc w przyszłość w przypadku innym znaleźć tę później, w jQuery 1.4.3 (dotychczas out) można skrócić go do tego:

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

Źródło

2010-05-08 12:24:31

+46

Należy również pamiętać, że 'bind ('keypress', false);' będzie zabronić wprowadzania wszystkich danych_. Więc jeśli chcesz zastosować to do elementów wprowadzania tekstu, użyj pierwszego rozwiązania – hohner

Jeśli używasz dynamicznych pól, powinieneś zmienić to na '$ ('body'). On ('keypress', '.noEnterSubmit', function () {...}); ' – seangates

Używanie klasy nie jest odpowiednie do kontrolowania semantycznego. Lepiej użyj danych-nosubmit lub podobnych atrybutów HTML5 dla tego samego. $ ("[dane-nosubmit]") to selektor. –

aby umożliwić wejść tylko na konkretnej klasy (w tym przykładzie „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; 
     } 
    }); 
});

Źródło

2013-04-02 04:58:57

Wystarczy dodać następujący kod w <Head> Tag w kodzie HTML. Będzie składać formularze na kluczu Enter. Dla wszystkich pól w formularzu

<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>

Źródło

2013-05-27 11:57:40

Wyłączanie przesyłania formularzy za pomocą klawisza Enter tylko na niektórych polach

Odpowiedz

Powiązane problemy