запретить отправку формы по enter

jQuery как запретить отправку формы по нажатию Enter

У меня есть следующие JavaScript на моей странице не работают.

Я хотел бы отключить отправку формы при вводе или, еще лучше, вызвать мою форму ajax. Любое решение приемлемо, но код, который я включаю выше, не препятствует отправке формы.

16 ответов

если keyCode Не пойман, лови which :

EDIT: пропустил его, лучше использовать keyup вместо keypress

EDIT 2: Как и в некоторых новых версиях Firefox, отправка формы не предотвращается, безопаснее добавить событие нажатия клавиши в форму. Также он не работает (больше?) просто привязав событие к форме «имя», но только к идентификатору формы. Поэтому я сделал это более очевидным, изменив пример кода соответственно.

EDIT 3: изменено bind() to on()

обычно форма представляется на Enter когда у вас есть фокус на входных элементах.

мы можем отключить Enter

на событие.который свойство нормализует событие.keyCode и события.аргументом charcode. Рекомендуется смотреть событие.что для ввода клавиш клавиатуры.

Это решение работает на всех формах на веб-сайте (также на формах, вставленных с ajax), предотвращая только ввод во входные тексты. Поместите его в функцию готовности документа и забудьте об этой проблеме на всю жизнь.

переизбыток необходимости захвата и тестирования каждого нажатия клавиши для ввода ключа действительно меня беспокоит, поэтому мое решение зависит от следующего поведения браузера:

нажатие ENTER вызовет клик событие на кнопке отправки (проверено в IE11, Chrome 38, FF 31) ** (ref:http://mattsnider.com/how-forms-submit-when-pressing-enter/ )

** это поведение не применимо, если форма имеет только 1 поле ввода, и это поле является «текстовым» вводом; в этом случае форма будет отправлена при вводе ключа, даже если нет отправки кнопка присутствует в разметке HTML (например, поле поиска). Это стандартное поведение браузера с 90-х годов.

большинство ответов выше не позволят пользователям добавлять новые строки в поле textarea. Если это то, чего вы хотите избежать, вы можете исключить этот конкретный случай, проверив, какой элемент в настоящее время имеет фокус :

Если вы просто хотите отключить submit on enter и кнопку submit тоже используйте событие onsubmit формы

вы можете заменить «return false» вызовом функции JS, которая сделает все необходимое, а также отправит форму в качестве последнего шага.

Я не знаю, если вы уже решить эту проблему, или кто-то пытается решить эту проблему прямо сейчас, но, вот мое решение для этого!

вы можете сделать это идеально в чистом Javascript, просто и не требуется библиотека. Вот мой подробный ответ на подобную тему: отключение клавиши enter для формы

короче говоря, вот код:

этот код предназначен для предотвращения ввода ключа «Enter» только для типа ввода= «text». (Потому что посетителю может потребоваться нажать enter на странице) Если вы хотите отключить «Enter» для других действий, вы можете добавить консоль.log (e); для вашего вашего цели тестирования и нажмите F12 в chrome, перейдите на вкладку » консоль «и нажмите» backspace » на странице и посмотрите внутри нее, чтобы увидеть, какие значения возвращаются, затем вы можете настроить все эти параметры для дальнейшего улучшения кода выше в соответствии с вашими потребностями для «электронная.цель.nodeName», «электронная.цель.тип» и многое другое.

следующий код отменит использование клавиши enter для отправки формы, но все равно позволит вам использовать клавишу enter в текстовом поле. Вы можете редактировать его дальше в зависимости от ваших потребностей.

в firefox, когда вы на входе и нажмите enter, он отправит его в верхней форме. Решение находится в форме отправит добавить это:

3 года спустя и ни один человек не ответил на этот вопрос полностью.

asker хочет отменить отправку формы по умолчанию и вызвать свой собственный Ajax. Это простая просьба с простым решением. Нет необходимости перехватывать каждый символ, введенный в каждый вход.

когда файл закончен (загрузка завершена), скрипт обнаруживает каждое событие для ключа «запись», и он отключает событие позади.

полное решение в JavaScript для всех браузеров

код выше, и большинство решений являются совершенными. Тем не менее, я думаю, что больше всего понравился один «короткий ответ», который является неполным.

Итак, вот весь ответ. в JavaScript с родной поддержкой IE 7, а также.

это решение теперь будет препятствовать пользователю отправлять с помощью клавиши enter и не будет перезагружать страницу или принимать вас в верхней части страницы, если ваша форма где-то под.

это должно отключить все формы с кнопками отправки в вашем приложении.

Источник

Запретить пользователям отправлять форму, нажав Enter

У меня есть опрос на веб-сайте, и, похоже, есть некоторые проблемы с тем, что пользователи нажимают клавишу ввода (я не знаю почему) и случайно отправляют опрос (форму), не нажимая кнопку отправки. Есть ли способ предотвратить это?

В опросе я использую HTML, PHP 5.2.9 и jQuery.

30 ответов

Вы можете использовать такой метод, как

Это идеальный способ, вы не будете перенаправлены со своей страницы

Просто вызовите это в методе отправки.

ТОЛЬКО ОТПРАВИТЬ БЛОК, но не другие важные функции клавиши ввода, такие как создание нового абзаца в

Вы также можете использовать javascript:void(0) для предотвращения отправки формы.

Запретить вводить ключ где угодно

в вашей форме, просто добавьте следующее в свой

Одной из приятных особенностей этого подхода является то, что он работает без JavaScript ; независимо от того, включен ли JavaScript или нет, для предотвращения неявной отправки формы требуется соответствующий стандартам веб-браузер.

Мне пришлось перехватить все три события, связанные с нажатием клавиш, чтобы форма не была отправлена:

Вы можете объединить все вышеперечисленное в красивую компактную версию:

Если вы используете сценарий для фактической отправки, вы можете добавить строку «return false» в обработчик onsubmit следующим образом:

Не помещать кнопку отправки можно. Просто поместите скрипт на вход (type = button) или добавьте eventListener, если вы хотите, чтобы он отправлял данные в форму.

Скорее используйте это

Чем использовать это

Предоставление форме действия ‘javascript: void (0);’ кажется, трюк

Мне нужно было предотвратить отправку только определенных входных данных, поэтому я использовал селектор классов, чтобы сделать эту функцию «глобальной» везде, где она мне нужна.

В качестве альтернативы, если keydown недостаточно:

Здесь уже есть много хороших ответов, я просто хочу внести свой вклад с точки зрения UX. Элементы управления с клавиатуры в формах очень важны.

Отключение Enter для отправки формы должно разрешить следующее:

Это всего лишь шаблон, но он соответствует всем трем условиям.

У меня была похожая проблема, когда у меня была сетка с «текстовыми полями ajax» (Yii CGridView) и всего одна кнопка отправки. Каждый раз, когда я выполнял поиск в текстовом поле и нажимал ввести отправленную форму. Мне пришлось что-то сделать с кнопкой, потому что это была единственная общая кнопка между представлениями (шаблон MVC). Все, что мне нужно было сделать, это удалить type=»submit» и поставить onclick=»document.forms[0].submit()

Я думаю, что он хорошо покрыт всеми ответами, но если вы используете кнопку с некоторым кодом проверки JavaScript, вы можете просто установить onkeypress формы для Enter, чтобы вызвать вашу отправку, как ожидалось:

JavaScript

Используя Javascript (без проверки полей ввода):

Если кто-то хочет применить это к определенным полям, например текст типа ввода:

В моем случае это хорошо работает.

В моем конкретном случае мне пришлось остановить ENTER от отправки формы, а также имитировать нажатие кнопки отправки. Это потому, что на кнопке отправки был обработчик кликов, потому что мы находились в модальном окне (унаследованный старый код). В любом случае вот мои комбо-решения на этот случай.

Этот вариант использования особенно полезен для людей, работающих с IE8.

Это работает для меня

Я хотел бы добавить небольшой код CoffeeScript (не тестировался в полевых условиях):

(Надеюсь, вам понравится красивый трюк в разделе «Если».)

Зайдите в свой css и добавьте это к нему, а затем автоматически заблокирует отправку вашего формуляра, пока вы отправляете ввод, если он вам больше не нужен, вы можете удалить его или вместо этого набрать activate и deactivate

Это отключает ключ ввода для всех форм на странице и не предотвращает ввод в текстовое поле.

Источник

Запретить пользователям отправлять форму, нажав Enter

У меня есть опрос на веб-сайте, и, кажется, есть некоторые проблемы с пользователями, нажимающими клавишу ввода (я не знаю почему) и случайно отправляющими опрос (форму), не нажимая кнопку отправки. Есть ли способ предотвратить это?

В опросе я использую HTML, PHP 5.2.9 и jQuery.

Вы можете использовать метод, такой как

При чтении комментариев к исходному сообщению, чтобы сделать его более удобным и позволить людям нажимать, Enter если они заполнили все поля:

Запретить ввод ключа в любом месте

формы, просто добавьте следующее

Приятной особенностью этого подхода является то, что он работает без JavaScript ; независимо от того, включен JavaScript или нет, требуется веб-браузер, соответствующий стандартам, чтобы предотвратить неявную отправку формы.

Мне пришлось перехватить все три события, связанные с нажатием клавиш, чтобы предотвратить отправку формы:

Вы можете объединить все вышеперечисленное в симпатичную компактную версию:

Придание форме действия javascript: void (0); кажется, добивается цели

Не положить кнопку отправки может сделать. Просто поместите скрипт для ввода (type = button) или добавьте eventListener, если вы хотите, чтобы он отправлял данные в форме.

Скорее используйте это

чем использовать это

Мне нужно было запретить отправку только определенных входных данных, поэтому я использовал селектор классов, чтобы это было «глобальной» функцией везде, где мне это нужно.

В качестве альтернативы, если нажатие клавиши недостаточно:

Изменяя различные хорошие ответы здесь, Enter ключ, кажется, работает во keydown всех браузерах. Для альтернативы, я обновил bind() к on() методу.

Источник

Запретить отправку формы при нажатии клавиши Enter

Роль ACE2 в распространении COVID-19 | Breakthrough Junior Challenge 2020

у меня есть form с двумя текстовыми полями, одно Выбрать падение и один переключатель. Когда войти нажата клавиша, я хочу вызвать свою функцию JavaScript, но когда я нажимаю ее, form представлен.

Как мне предотвратить form от представления, когда войти клавиша нажата?

Хорошо, представьте, что у вас есть следующее текстовое поле в форме:

Чтобы запустить какой-то «пользовательский» скрипт из этого текстового поля при нажатии клавиши ввода, а не отправлять форму, вот некоторые образец код. Обратите внимание, что эта функция не проверяет ошибки и, скорее всего, будет работать только в IE. Чтобы сделать это правильно, вам нужно более надежное решение, но вы получите общее представление.

возврат значения функции предупредит обработчик событий, чтобы он больше не всплывал в событии, и предотвратит дальнейшую обработку события нажатия клавиши.

ЗАМЕТКА:

Было указано, что keyCode устарела. Следующая лучшая альтернатива which также устарел.

Кроме того, хотя устаревшее предупреждение довольно зловещее, keyCode и which их удаление означало бы серьезные изменения в несметном количестве устаревших веб-сайтов. По этой причине, маловероятно, что они собираются куда-либо в ближайшее время.

Используйте оба event.which и event.keyCode :

event.key === «Enter»

Современный стиль, с лямбдой и деструктуризацией

Если вы используете jQuery:

Обнаружить нажатие клавиши Enter на всем документе:

Отменить onsubmit действие формы должно быть вызовом вашей функции и добавить после него return false, то есть:

собственный js (получить api)

Источник

Запретить пользователям отправлять форму, нажав Enter

У меня есть опрос на веб-сайте, и, похоже, есть некоторые проблемы с пользователями, нажимая enter (я не знаю, почему) и случайно отправляя опрос (форму), не нажимая кнопку отправки. Есть ли способ предотвратить это?

Я использую HTML, PHP 5.2.9 и jQuery в опросе.

27 ответов

Вы можете использовать такой метод, как

при чтении комментариев к исходному сообщению, чтобы сделать его более удобным и позволить людям нажать Enter если они завершили все поля:

запретить ввод ключа в любом месте

в вашей форме, затем просто добавьте следующее в свой

предоставление форме действия » javascript: void (0);», кажется, делает трюк

если пользовательский агент поддерживает разрешение пользователю отправлять форму неявно (например, на некоторых платформах, нажав клавишу «enter», а текстовое поле фокусируется неявно отправляет форму), затем делает это для формы,по умолчанию определен поведение активации!—5—> должен вызвать агент пользователя выполнить шаги активации синтетического щелчка на по умолчанию.

Примечание: следовательно, если по умолчанию отключено, форма не отправляется при использовании такого неявного механизма отправки. (Ля кнопки нет поведение активации!—5—> когда отключен.)

таким образом, совместимый со стандартами способ отключить любую неявную подачу формы-разместить отключенную кнопку отправки в качестве первой кнопки отправки в форме:

одна приятная особенность этого подхода заключается в том, что он работает без JavaScript; независимо от того, включен ли JavaScript, для предотвращения неявной формы требуется соответствующий стандартам веб-браузер подчинение.

мне нужно было предотвратить отправку только определенных входных данных, поэтому я использовал селектор классов, чтобы это была «глобальная» функция, где бы она мне ни понадобилась.

альтернативно, если keydown недостаточно:

изменение различных хороших ответов здесь, Enter ключ, кажется, работает для keydown во всех браузерах. Для альтернативы, я обновил bind() до on() метод.

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *