Блог

Главная - Вопросы по программированию - Поведение автоматической отправки ввода чисел для Android и HTML5

Поведение автоматической отправки ввода чисел для Android и HTML5

#javascript #android #html #form-submit

#javascript #Android #HTML #форма-отправить

Вопрос:

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

например

 <form method="GET">
    <input type="hidden" id="ProductCode" value="12345" />
    Enter zip: <input type="number" id="ZipCode" />
</form>

Текущее поведение, по-видимому, недостаточно очевидно:

 <script>
$(document).ready(function() {
    $('#ZipCode').keyup(function() {
        if($(this).val().length == 5) {
            $(this).closest('form').submit();
        }
    });
    $('#ZipCode').focus(function() {
        $(this).val('');
    });
});
</script>

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

Ответ №1:

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

 <form method="GET">
    <input type="hidden" id="ProductCode" value="12345" />
    Enter zip: <input type="number" id="ZipCode" />
    <button type="submit" style="display:none">
</form>

Вы можете использовать $("form").submit(function(){ // run when form is submitted }) для реализации кода отправки.

Комментарии:

1. Проблема, с которой я сталкиваюсь, заключается в том, что submit() не запускается на моем тестовом устройстве при вводе ввода на цифровой клавиатуре. Клавиша ввода даже не регистрируется, когда я пытаюсь захватить код сканирования в обработчиках событий onKeyPress, onKeyUp, onKeyDown. Похоже, что все, что клавиша ввода делает на моем устройстве (Galaxy S II), — это закрыть цифровую клавиатуру. Я пробовал обе реализации выше, но без каких-либо изменений в поведении. Я почти задаюсь вопросом, является ли это наложением пользовательского интерфейса…

2. @KrisOye Теперь я понимаю, что ты имеешь в виду. Я знаю, что клавиша Android «enter» является bi-причудливой и не регистрируется в обработчиках событий, но я думал, что она, по крайней мере, отправит форму (аппаратную и программную клавиатуру) с помощью кнопки. На мой взгляд, другого решения нет.

Ответ №2:

Поместите кнопку отправки в форму, и клавиша ввода отправит форму естественным образом.

 <form method="GET">
    <input type="hidden" id="ProductCode" value="12345" />
    Enter zip: <input type="number" id="ZipCode" />
    <input type="submit" value="submit" style="visibility: hidden" /> 
</form>

Если вам нужно проверить привязку к событию отправки формы и выполнить необходимую проверку там.

 $('form').submit(function() {
    var invalid = $('#ZipCode').val().length !== 5;
    if(invalid)
        return false
});
Метки: