у меня проблема. Я проверю свой 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]
Значения полей ввода должны быть прочитаны в обработчике событий, в вашем случае вы читаете значения 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();
}
}
});
Все опубликованные ответы используют неэффективную практику запросов. Вы не должны запрашивать элементы в каждом нажатии клавиши. Используйте селектора 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");
}
}
});
$("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();
}
}
});
Вам нужно проверить значения ваших входов внутри вашего события нажатия клавиши, поскольку оно стоит, вы проверяете значения на загрузке 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();
}
}
});
Вам необходимо обновить или создать переменные входных значений в вашей функции нажатия клавиш. В настоящий момент переменные устанавливаются, когда страница загружается, поэтому переменная булавки всегда будет пустой при нажатии кнопки ввода. Вы хотите проверить содержимое переменных после нажатия клавиши.
$("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();
}
}
});