подтвердить нажатием клавиши ввода

0

у меня проблема. Я проверю свой Testsite. Итак, у меня есть 4 поля ввода, на которые я хочу проверить.

Моя проверка работает, но я пишу все 4 входа. Я получаю предупреждение, которое не то, что я хочу, потому что мне нужна ссылка на действие формы.

Здесь мой код:

var pin1 = jQuery('#pin1').val();
    var pin2 = jQuery('#pin2').val();
    var pin3 = jQuery('#pin3').val();
    var pin4 = jQuery('#pin4').val();

    var pin = pin1 + pin2 + pin3 + pin4;

   $("input").keypress(function(event) {
        if (event.which == 13) {

            event.preventDefault();

           if(pin == ""){
                alert("Bitte füllen Sie alle Inputfelder aus");
            }else{
                $("form").submit();
            }



        }
    });

И здесь мой Testsite: http://devauth.labscope.de/htmlapp/[email protected]

Теги:
validation
input
keypress

5 ответов

1
Лучший ответ

Значения полей ввода должны быть прочитаны в обработчике событий, в вашем случае вы читаете значения pin на dom ready... что означает, что они имеют значения по умолчанию в полях pin которые могут быть пустыми строками

$("input").keypress(function(event) {
    if (event.which == 13) {
        var pin1 = jQuery('#pin1').val();
        var pin2 = jQuery('#pin2').val();
        var pin3 = jQuery('#pin3').val();
        var pin4 = jQuery('#pin4').val();
        var pin = pin1 + pin2 + pin3 + pin4;

        event.preventDefault();
        if(pin == ""){
            alert("Bitte füllen Sie alle Inputfelder aus");
        }else{
            $("form").submit();
        }
    }
});
0

Все опубликованные ответы используют неэффективную практику запросов. Вы не должны запрашивать элементы в каждом нажатии клавиши. Используйте селектора jQuery один раз и сохраните их в переменных:

var pin1 = $('#pin1'), pin2 = $('#pin2'), pin3 = $('#pin3'), pin4 = $('#pin4');


$("input").keypress(function(event) {
    if (event.which == 13) {
        event.preventDefault();
        var pin = pin1.val() + pin2.val() + pin3.val() + pin4.val()

        if(pin == ""){
            alert("Bitte füllen Sie alle Inputfelder aus");
        } else {
            $("form").submit();
        }
    }
});

Однако этот код по-прежнему не будет работать так, как вы надеялись. Если пользователь вводит значение в одном из полей и попадает, будет вызван метод submit().

Вместо проверки недействительного ввода попробуйте проверить допустимый ввод. Я также сделал некоторые другие передовые практики:

var $inputs = $('.login_input'), $form = $('#pin_login');

$inputs.keypress(function(event) {
    if (event.which == 13) {
        event.preventDefault();

        var pin = $inputs.map(function(i,ele){return ele.value}).get().join('');

        if(pin.length == 4) {
            $form.submit();
        } else {
            alert("Bitte füllen Sie alle Inputfelder aus");
        }
    }
});
0
$("input").keypress(function (event) {
    if (event.which == 13) {
        event.preventDefault();

        // every time you press enter the values must be renewed

        var pin1 = jQuery('#pin1').val();
        var pin2 = jQuery('#pin2').val();
        var pin3 = jQuery('#pin3').val();
        var pin4 = jQuery('#pin4').val();
        var pin = pin1 + pin2 + pin3 + pin4;

        if ($.trim(pin).length !== 4) { 
          // remove white space and check if 4 characters
            alert("Bitte füllen Sie alle Inputfelder aus");
        } else {
            $("form").submit();
        }
    }
});
0

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

   $("input").keypress(function(event) {
        var pin1 = jQuery('#pin1').val();
        var pin2 = jQuery('#pin2').val();
        var pin3 = jQuery('#pin3').val();
        var pin4 = jQuery('#pin4').val();

        var pin = pin1 + pin2 + pin3 + pin4;


        if (event.which == 13) {

            event.preventDefault();

           if(pin == ""){
                alert("Bitte füllen Sie alle Inputfelder aus");
            }else{
                $("form").submit();
            }

        }
    });
0

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

$("input").keypress(function(event) {
    if (event.which == 13) {
        event.preventDefault();
        var pin1 = jQuery('#pin1').val();
        var pin2 = jQuery('#pin2').val();
        var pin3 = jQuery('#pin3').val();
        var pin4 = jQuery('#pin4').val();
        var pin = pin1 + pin2 + pin3 + pin4;

        if(pin == ""){
            alert("Bitte füllen Sie alle Inputfelder aus");
        }else{
            $("form").submit();
        }
    }
});

Ещё вопросы

Сообщество Overcoder
Наверх
Меню