Как отправить форму ввода, когда текстовое поле имеет фокус?

Question

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

Я использовал Firebug для проверки текстовой области комментариев в Stack Overflow (которая имеет такое поведение), но не смог увидеть JavaScript, который достиг этого эффекта. Есть ли способ изменить поведение текстовой области без использования JavaScript?

Answer 1

Вы не можете сделать это без JavaScript.Stackoverflow использует библиотеку JavaScript jQuery , которая прикрепляет функции к элементам HTML при загрузке страницы.

Вот как это можно сделать с помощью обычного JavaScript:

<textarea onkeydown="if (event.keyCode == 13) { this.form.submit(); return false; }"></textarea>

Код ключа 13это ключ ввода.

Вот как вы можете сделать это с помощью jQuery, как это делает Stackoverflow:

<textarea class="commentarea"></textarea>

с

$(document).ready(function() {
    $('.commentarea').keydown(function(event) {
        if (event.which == 13) {
            this.form.submit();
            event.preventDefault();
         }
    });
});

Answer 2

Почему вы хотите, чтобы текстовая область отправлялась, когда вы нажимаете клавишу ввода?

По умолчанию ввод текста вводится при нажатии клавиши ввода.Это однострочный вход.

<input type="text" value="...">

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

<textarea name="area"></textarea>

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

Answer 3

<form id="myform">
    <input type="textbox" id="field"/>
    <input type="button" value="submit">
</form>

<script>
    $(function () {
        $("#field").keyup(function (event) {
            if (event.which === 13) {
                document.myform.submit();
            }
        }
    });
</script>