Mam na swojej stronie następujący kod JavaScript, który wydaje się nie działać.
$('form').bind("keypress", function(e) {
if (e.keyCode == 13) {
e.preventDefault();
return false;
}
});
Chciałbym wyłączyć przesyłanie formularza przy wejściu, lub jeszcze lepiej, aby wywołać mój formularz ajax przesłania. Każde rozwiązanie jest dopuszczalne, ale powyższy kod nie uniemożliwia przesłania formularza.
javascript
jquery
forms
form-submit
Adam Levitt
źródło
źródło
Odpowiedzi:
Jeśli
keyCode
nie zostanie złapany, złapwhich
:EDYCJA: przegapiłem, lepiej używać
keyup
zamiastkeypress
EDYCJA 2: Ponieważ w niektórych nowszych wersjach Firefoksa przesyłanie formularza nie jest uniemożliwione, bezpieczniej jest również dodać zdarzenie naciśnięcia klawisza do formularza. Również to nie działa (już?), Po prostu wiążąc zdarzenie z formularzem „nazwa”, ale tylko z identyfikatorem formularza. Dlatego uczyniłem to bardziej oczywistym, odpowiednio zmieniając przykład kodu.
EDYCJA 3: Zmieniono
bind()
naon()
źródło
e.which
, więc nie musisz testowaće.keyCode
, ale +1 dla najbardziej prawdopodobnej przyczyny tego problemu.return false;
tego?e.preventDefault();
wydaje się enougthkeyCode === 13 && !$(e.target).is('textarea')
Zwykle formularz jest przesyłany, Entergdy koncentrujesz się na elementach wejściowych.
Możemy wyłączyć Enterklucz (kod
13
) na elementach wejściowych w formularzu:DEMO: http://jsfiddle.net/bnx96/325/
źródło
textareas
w tej samej formie. Używanie$("form input")
zamiast$("form :input")
wydaje się to naprawić. DEMO: jsfiddle.net/bnx96/279Jeszcze krótszy:
źródło
function(e) {e.preventDefault();}
ponieważ wartości zwracane w procedurach obsługi zdarzeń są nieaktualne: stackoverflow.com/a/20045473/601386Enter
a nie wyłączania przesyłania formularza za pomocąSubmit
przycisku.onClick
zdarzenia jQuery do sprawdzenia poprawności formularza i nadal przesyłać za pomocą jQuery. Innymi słowy, są przypadki, w których chcesz przesyłać tylko przez javascript / jQuery. Chociaż nadal możesz używać AJAX z tym rozwiązaniem, wyłącza on podstawową funkcjonalnośćsubmit
metody.which
dokumentyźródło
To rozwiązanie działa na wszystkich formularzach na stronie internetowej (również na formularzach wstawionych z ajaxem), zapobiegając jedynie wpisywaniu tekstu wejściowego. Umieść go w funkcji gotowości do dokumentu i zapomnij o tym problemie na całe życie.
źródło
Większość odpowiedzi powyżej uniemożliwi użytkownikom dodawanie nowych wierszy w polu tekstowym. Jeśli tego chcesz uniknąć, możesz wykluczyć ten konkretny przypadek, sprawdzając, który element jest aktualnie aktywny:
źródło
Przesada polegająca na przechwytywaniu i testowaniu każdego naciśnięcia klawisza ENTER naprawdę mnie wkurza, więc moje rozwiązanie opiera się na następującym zachowaniu przeglądarki:
Naciśnięcie klawisza ENTER wywoła zdarzenie kliknięcia przycisku przesyłania (testowane w IE11, Chrome 38, FF 31) ** (patrz: http://mattsnider.com/how-forms-submit-when-pressing-enter/ )
Więc moim rozwiązaniem jest usunięcie standardowego przycisku wysyłania (tj.
<input type="submit">
), Aby powyższe zachowanie zawiodło, ponieważ nie ma przycisku wysyłania, który magicznie kliknąłby po naciśnięciu klawisza ENTER. Zamiast tego używam modułu obsługi kliknięć jQuery na zwykłym przycisku, aby przesłać formularz metodą jQuery.submit()
.Demo: http://codepen.io/anon/pen/fxeyv?editors=101
** to zachowanie nie ma zastosowania, jeśli formularz ma tylko 1 pole wejściowe, a pole to jest tekstem; w takim przypadku formularz zostanie przesłany po naciśnięciu klawisza ENTER, nawet jeśli w znaczniku HTML nie ma przycisku wysyłania (np. pola wyszukiwania). Jest to standardowe zachowanie przeglądarki od lat 90.
źródło
jeśli chcesz po prostu wyłączyć opcję przesyłania przy wejściu i przycisk przesyłania, skorzystaj z zdarzenia onsubmit formularza
Możesz zastąpić „return false” wywołaniem funkcji JS, która zrobi wszystko, co potrzebne, a także prześle formularz jako ostatni krok.
źródło
Możesz to zrobić doskonale w czystym JavaScript, prosty i bez biblioteki. Oto moja szczegółowa odpowiedź na podobny temat: Wyłączanie klawisza Enter dla formularza
Krótko mówiąc, oto kod:
źródło
e.target.nodeName === 'INPUT' && e.target.type !== 'textarea'
. Podany kod pozwoli na przesyłanie formularzy, jeśli radio lub pole wyboru są skoncentrowane.Nie wiem, czy już rozwiązałeś ten problem, czy ktoś próbuje go teraz rozwiązać, ale oto moje rozwiązanie!
źródło
Prostym sposobem jest zmiana typu przycisku na przycisk - w html, a następnie dodanie zdarzenia w js ...
Zmień z tego:
Do
I w js lub jquery dodaj:
źródło
Poniższy kod zignoruje użycie klawisza Enter do przesłania formularza, ale nadal pozwoli na użycie klawisza Enter w polu tekstowym. Możesz go dalej edytować w zależności od potrzeb.
źródło
W Firefoksie, kiedy wejdziesz i naciśniesz enter, prześle on swoją górną formę. Rozwiązanie znajduje się w formularzu prześlij dodaj to:
źródło
3 lata później ani jedna osoba nie udzieliła pełnej odpowiedzi na to pytanie.
Pytający chce anulować domyślne przesłanie formularza i wywołać własny Ajax. To proste zapytanie z prostym rozwiązaniem. Nie ma potrzeby przechwytywania każdego znaku wprowadzonego do każdego wejścia.
Zakładając, że postać ma przedstawić przycisk, czy
<button id="save-form">
lub<input id="save-form" type="submit">
wykonaj:źródło
Słyszałem, że
which
nie jest zalecane, więc zmień Najlepszą odpowiedź na to pytanie .ref. https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/which
źródło
Po zakończeniu pliku (ładowanie zakończone) skrypt wykrywa każde zdarzenie dla klucza „Entry” i wyłącza zdarzenie z tyłu.
źródło
Kompletne rozwiązanie w JavaScript dla wszystkich przeglądarek
Powyższy kod i większość rozwiązań jest idealna. Myślę jednak, że najbardziej podobała się jedna „krótka odpowiedź”, która jest niepełna.
Oto cała odpowiedź. w JavaScript z natywną obsługą również dla IE 7.
To rozwiązanie uniemożliwi teraz użytkownikowi przesłanie przy użyciu klawisza Enter i nie przeładuje strony ani nie przeniesie Cię na górę strony, jeśli formularz znajduje się gdzieś poniżej.
źródło
Co powiesz na to:
Powinno to wyłączyć wszystkie formularze za pomocą przycisków przesyłania w aplikacji.
źródło