Избегайте только отправки формы при нажатии клавиши Enter - PullRequest
Новая
       1

Избегайте только отправки формы при нажатии клавиши Enter

0 голосов
/ 24 декабря 2018

У меня есть одна форма, в которой есть несколько входов, а также текстовое поле, как показано ниже. 

<form id="my_form" action="/action_page.php">
  First name:<br>
  <input type="text" name="firstname">
  <br>
  Last name:<br>
  <input type="text" name="lastname">
  <br>
  Note:<br>
  <textarea id="note" name="note"></textarea>
  <br>
  <input type="submit" value="Submit">
</form>

Я должен отключить отправку формы при нажатии клавиши Enter.Форма должна быть отправлена ​​только по нажатию кнопки отправки.

Я нашел это решение для stackoverflow, поэтому я написал ниже код. 

$("#my_form").keypress( function( e ) {
    var code = e.keyCode || e.which;
    if ( code == 13 ) {
        e.preventDefault();
        return false;
    }
});

Работает нормально, но неразрешить ввод новой строки в текстовой области при нажатии клавиши Enter.Как мне этого добиться?

Ответы [ 5 ]

0 голосов
/ 24 декабря 2018

Это будет работать: 

<html lang="en">
<head>
  <script
      src="https://code.jquery.com/jquery-3.3.1.min.js"
      integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
      crossorigin="anonymous"></script>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
<form id="my_form" action="/action_page.php">
  First name:<br>
  <input type="text" name="firstname" id="f">
  <br>
  Last name:<br>
  <input type="text" name="lastname" id="l">
  <br>
  Note:<br>
  <textarea id="note" name="note"></textarea>
  <br>
  <input type="submit" value="Submit">
</form>
<script>

  $("#note").keypress( function( e ) {
    var code = e.keyCode || e.which;
    if ( code == 13 ) {

      return true;
    }
  });
  $("#f").keypress( function( e ) {
    var code = e.keyCode || e.which;
    if ( code == 13 ) {
      e.preventDefault();
      return false;
    }

  });
  $("#l").keypress( function( e ) {
    var code = e.keyCode || e.which;
    if ( code == 13 ) {
      e.preventDefault();
      return false;
    }

  });

</script>
</body>
</html>

Дать id s для ввода имени и фамилии.Отключить нажатие на них.

0 голосов
/ 24 декабря 2018

Замените вашу кнопку этой кнопкой 

<button type="button" onclick="formSubmit()">Submit</button>

, затем обработчик отправит событие с помощью JavaScript, как показано ниже. 

function formSubmit() { 
    //here your code
}
0 голосов
/ 24 декабря 2018

Просто замените $ ("# my_form") на $ ("# my_form input: text ").

Так будет выглядеть код, 

$("#my_form input:text").keypress( function( e ) {
    //Do stuff here
});
0 голосов
/ 24 декабря 2018

Легко, просто измените: 

<input type="submit" value="Submit">

Кому:

<input type="button" value="Submit">

Затем обработайте нажатие кнопки в jQuery (или чисто JS).

0 голосов
/ 24 декабря 2018

Вы можете использовать :not() Селектор для ввода. 

$("#my_form:not(input:text)").keypress( function( e ) {
    var code = e.keyCode || e.which;
    if ( code == 13 ) {
        e.preventDefault();
        return false;
    }
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...