2015-09-27 8 views
1

Я пытаюсь создать проверку паспорта, которая зависит от ее формата, я создал 2 строки ввода. Первая панель ввода, которая позволяет пользователю вводить только 2 буквы, а вторая панель ввода позволяет вводить только 7 цифр. Какая функция Javascript для проверки пользовательского ввода 2 письма только не цифры и ввести 7 цифр только не буквы на своих уважаемых входные барахПроверка паспорта

Вот то, что я до сих пор

<!doctype html> 
 
<html> 
 

 
<body> 
 
<div class="form-group"> 
 
<label for="passportno" class="control-label col-xs-4"><p class="left">Passport No.</p></label> 
 
\t \t \t \t \t \t \t \t \t \t 
 
<input size="1" name="passportno" class="form-control" placeholder=""required/> - 
 
<input size="14" name="passportno" class="form-control" placeholder=""required/> 
 
\t \t \t \t \t \t \t \t \t \t 
 
</div> 
 
</script> 
 
</body> 
 
</html>

+2

у вас есть конкретный вопрос? – CollinD

+0

Спасибо за головы! : D – Vista

+0

@arthur также проверяет ввод только числа/буквы – Vista

ответ

2

Ниже код показывает, является ли вход действительным входом или нет. Если нет, то предупреждение показывает false. Замените оповещение кодом, чтобы показывать сообщение или что-то еще.

Используйте maxlength атрибут HTML для максимальных входных символов

$(document).ready(function(){ 
 
    $("#submitButton").click(function(){ 
 
     alert(/^\d+$/.test($('#passportNumber').val()));  // 2 digit number validation 
 
     alert(/^[a-zA-Z]+$/.test($('#passportSeries').val())); // 7 character validation 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!doctype html> 
 
<html> 
 

 
<body> 
 
<div class="form-group"> 
 
<label for="passportno" class="control-label col-xs-4"><p class="left">Passport No.</p></label> 
 
\t \t \t \t \t \t \t \t \t \t 
 
<input maxlength="2" id="passportNumber" class="form-control" placeholder=""required/> - 
 
<input maxlength="7" id="passportSeries" class="form-control" placeholder=""required/> 
 
<input type="button" value="submit" id="submitButton" /> \t \t \t 
 
</div> 
 
</script> 
 
</body> 
 
</html>

0

Ниже приводится один из майских способов.

  • Набор MaxLength к введенному
  • имеют уникальные имена ваших входов (не одно и то же)
  • Поскольку я не вижу кнопку для проверки, я использовал KeyUp, входные (сделки с копией + паста и т.д.)

$("input").on("keyup input", function() { 
 
\t 
 
    var $this = $(this); 
 
    var val = $.trim($this.val()) || ""; 
 

 
    if (this["name"] === "passportno") { 
 
    \t val = val.replace(/[^\d]/g, ''); 
 
    } else { 
 
     val = val.replace(/[^a-z]/gi, ''); 
 
    } 
 
\t $this.val(val); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="form-group"> 
 
    <label for="passportno" class="control-label col-xs-4"><p class="left">Passport No.</p></label> 
 

 
    <input size="1" name="passportno" class="form-control" placeholder="" required="" maxlength="2" /> - 
 
    <input size="14" name="passportletters" class="form-control" placeholder="" required="" maxlength="7" /> 
 

 
</div>

Смежные вопросы