Отправить форму при нажатии Enter - PullRequest
Новая
       11

Отправить форму при нажатии Enter

1 голос
/ 30 марта 2010

У меня есть форма на сайте с поддержкой jQuery. Форма не имеет кнопки <input type="submit">. По этой причине он не отправляется, когда вы нажимаете , введите . Каков рекомендуемый способ эмулировать такое поведение? 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head><title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript"><!--
$(function(){
    $("form input:first").focus();
});
//--></script>
</head>
<body>

<form action="" method="post">
<input type="text" name="user">
<input type="password" name="pass">
</form>

</body>
</html>

Обновление

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

Ответы [ 7 ]

11 голосов
/ 30 марта 2010

Поместите кнопку отправки в форму и сделайте ее невидимой с помощью JavaScript. Это выполняет 2 цели:

  1. Кнопка ввода будет работать, потому что там есть присутствует кнопка отправки
  2. Пользователи, не поддерживающие JavaScript, смогут использовать вашу форму
4 голосов
/ 30 марта 2010

Я бы захватил событие нажатия клавиш элементов ввода, следил за кодом клавиши 13 (ввод) и вызывал отправку. Вот так: 

$("form input").keypress(function(ev){
    if (ev.keyCode == 13) {
        $("form")[0].submit();
    }
});

Этот код не проверен.

2 голосов
/ 30 марта 2010

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

1 голос
/ 30 марта 2010

Safari, Firefox, Opera и IE8 все отправляют форму, когда вы нажимаете ввод в поле ввода текста . Ни кнопка отправки, ни JavaScript не нужны. Попробуй себя .

(Не проверял IE6 / 7, но я на 95% уверен, что они тоже.)

Я согласен с другими, что захват ввода не очень хорошая идея.

Обновление : вышеизложенное верно, за исключением того, что Firefox не отправляет форму, содержащую поле пароля и не имеющую кнопку отправки Не знаю почему, кто-нибудь может увидеть причину этого?

Обновление 2 : ... и, кроме IE, если есть только одно поле ввода.

1 голос
/ 30 марта 2010

Рекомендуется? Я не уверен, что рекомендуется подражать этому поведению вообще!

Несмотря на то, что вы можете возиться с попыткой обнаружить keypress для Enter, существуют некоторые тонкие различия в браузере относительно того, как должны работать нажатия Enter, которые не будут полностью такими же, как вы. И ваша форма вообще не сможет работать без JavaScript, что не идеально.

Так что вставьте кнопку отправки. Если вы действительно непреклонны, что кнопка не должна появляться на странице (и я не уверен, что это хорошая идея), вы всегда можете расположить ее абсолютно слева. сторона страницы, где никто не может ее видеть.

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

1 голос
/ 30 марта 2010

Используйте плагин jquery form.

http://malsup.com/jquery/form/

0 голосов
/ 30 марта 2010

Я использовал следующую вещь для той же цели, но не для jquery, попробуйте, это может помочь вам. 

function submitenter(myfield,e)
  {
    var keycode;
    if (window.event) keycode = window.event.keyCode;
    else if (e) keycode = e.which;
    else return true;

    if (keycode == 13)
    {
        myfield.form.onsubmit();
        return false;
    }
    else
     return true;
  }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...