Как предотвратить нажатие клавиши ВВОД при отправке веб-формы? - PullRequest
194 голосов
/ 25 февраля 2009

Как предотвратить отправку формы в веб-приложении нажатием клавиши ENTER ?

Ответы [ 27 ]

4 голосов
/ 21 января 2010
stopSubmitOnEnter (e) {
  var eve = e || window.event;
  var keycode = eve.keyCode || eve.which || eve.charCode;

  if (keycode == 13) {
    eve.cancelBubble = true;
    eve.returnValue = false;

    if (eve.stopPropagation) {   
      eve.stopPropagation();
      eve.preventDefault();
    }

    return false;
  }
}

Тогда в вашей форме:

<form id="foo" onkeypress="stopSubmitOnEnter(e);">

Хотя было бы лучше, если бы вы не использовали навязчивый JavaScript.

3 голосов
/ 18 июля 2013

Добавьте этот тег к вашей форме - onsubmit="return false;" Тогда вы можете отправить свою форму только с некоторой функцией JavaScript.

3 голосов
/ 05 октября 2012

Запрет "ВВОДА" при отправке формы может причинить неудобства некоторым вашим пользователям. Так что было бы лучше, если вы будете следовать процедуре ниже:

Напишите событие onSubmit в теге формы:

<form name="formname" id="formId" onSubmit="return testSubmit()" ...>
 ....
 ....
 ....
</form>

написать функцию Javascript следующим образом:

function testSubmit(){
  if(jQuery("#formId").valid())
      {
        return true;
      }
       return false;

     } 

     (OR)

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

    $(document).ready(function() {
          $(window).keydown(function(event){
          if(event.keyCode == 13) {
               event.preventDefault();
               return false;
              }
           });
         });

спасибо.

3 голосов
/ 02 сентября 2011

В моем случае этот jQuery JavaScript решил проблему

jQuery(function() {
            jQuery("form.myform").submit(function(event) {
               event.preventDefault();
               return false;
            });
}
3 голосов
/ 01 марта 2017

Чтобы предотвратить отправку формы при нажатии , введите в поле textarea или input, проверьте событие отправки, чтобы определить, какой тип элемента отправил событие.

Пример 1

HTML

<button type="submit" form="my-form">Submit</button>
<form id="my-form">
...
</form>

JQuery

$(document).on('submit', 'form', function(e) {
    if (e.delegateTarget.activeElement.type!=="submit") {
        e.preventDefault();
    }
});

Лучшее решение - если у вас нет кнопки отправки и вы запускаете событие с помощью обычной кнопки. Это лучше, потому что в первом примере 2 события отправки запускаются, но во втором примере срабатывает только 1 событие отправки.

Пример 2

HTML

<button type="button" onclick="$('#my-form').submit();">Submit</button>
<form id="my-form">
...
</form>

JQuery

$(document).on('submit', 'form', function(e) {
    if (e.delegateTarget.activeElement.localName!=="button") {
        e.preventDefault();
    }
});
3 голосов
/ 13 мая 2017

Вы найдете это более простым и полезным: D

$(document).on('submit', 'form', function(e){
    /* on form submit find the trigger */
    if( $(e.delegateTarget.activeElement).not('input, textarea').length == 0 ){
        /* if the trigger is not between selectors list, return super false */
        e.preventDefault();
        return false;
    } 
});
2 голосов
/ 19 октября 2011

Как насчет:

<asp:Button ID="button" UseSubmitBehavior="false"/>
2 голосов
/ 13 октября 2015

Пожалуйста, проверьте эту статью Как предотвратить нажатие клавиши ВВОД для отправки веб-формы?

$(“.pc_prevent_submit”).ready(function() {
  $(window).keydown(function(event) {
    if (event.keyCode == 13) {
      event.preventDefault();
      return false;
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class=”pc_prevent_submit” action=”” method=”post”>
  <input type=”text” name=”username”>
  <input type=”password” name=”userpassword”>
  <input type=”submit” value=”submit”>
</form>
1 голос
/ 25 апреля 2012

Эта ссылка предоставляет решение, которое работает для меня в Chrome, FF и IE9, а также эмулятор для IE7 и 8, который поставляется с инструментом разработчика IE9 (F12).

http://webcheatsheet.com/javascript/disable_enter_key.php

1 голос
/ 09 марта 2013

Просто добавьте этот атрибут в тег FORM:

onsubmit="return gbCanSubmit;"

Затем добавьте в свой тег SCRIPT:

var gbCanSubmit = false;

Затем, когда вы создаете кнопку или по какой-либо другой причине (как в функции), вы наконец разрешаете отправку, просто переворачиваете глобальное логическое значение и выполняете вызов .submit (), как в этом примере:

function submitClick(){

  // error handler code goes here and return false if bad data

  // okay, proceed...
  gbCanSubmit = true;
  $('#myform').submit(); // jQuery example

}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...