У меня есть текстовое поле, которое должно позволять пользователю вводить числа, максимальная длина должна быть 2, а максимальное значение должно быть 31, а минимальное значение — 1. Я могу выполнить первые 2 условия, но не знаю последние 2 условия.

Кто-нибудь может мне помочь, пожалуйста?

{amp}lt;input type="text" name = "ccdate" class="form-control" maxlength="2" onkeypress="return isNumber(event)" {amp}gt; function isNumber(evt) { evt = (evt) ? evt : window.event; var charCode = (evt.which) ? evt.which : evt.keyCode; if (charCode {amp}gt; 31 {amp}amp;{amp}amp; (charCode {amp}lt; 48 || charCode {amp}gt; 57)) { return false; } return true; } 

ПРИМЕЧАНИЕ: я не хочу использовать HTML5 input type = «number»

Попробуйте это (Чисто Jquery подход):

HTML:

 {amp}lt;input type="text" name = "ccdate" class="form-control" maxlength="2"{amp}gt; {amp}lt;div id="div1"{amp}gt;{amp}lt;/div{amp}gt; 

JQUERY:

 $('[name="ccdate"]').keyup(function(){ if(parseInt($(this).val()) {amp}gt; 31){ $('#div1').html('value cannot be greater then 31'); $(this).val(''); } else if(parseInt($(this).val()) {amp}lt; 1) { $('#div1').html('value cannot be lower then 1'); $(this).val(''); } else { $('#div1').html(''); } }); 

Рабочая Демо


РЕДАКТИРОВАТЬ: — (согласно комментарию спрашивающего, чтобы проверить введенную пользователем строку или номер):

 $('[name="ccdate"]').keyup(function(){ if(isNaN($(this).val())) { $('#div1').html('entered string'); $(this).val(''); } else if(parseInt($(this).val()) {amp}gt; 31){ $('#div1').html('value cannot be greater then 31'); $(this).val(''); } else if(parseInt($(this).val()) {amp}lt; 1) { $('#div1').html('value cannot be lower then 0'); $(this).val(''); } else { $('#div1').html(''); } }); 

Рабочая Демо


РЕДАКТИРОВАТЬ: — (Подход на основе чистого Javascript) (Просто введите уникальный id в текстовое поле, например, 't1' )

 document.getElementById('t1').addEventListener('keyup', function(){ this.value = (parseInt(this.value) {amp}lt; 1 || parseInt(this.value) {amp}gt; 31 || isNaN(this.value)) ? "" : (this.value) }); 

Рабочая Демо

 document.querySelector("*[name=ccdate]").addEventListener("input", function () { var num =  this.value, max = 31, min = 1; //converts value to a Number if(!this.value.length) return false; //allows empty field this.value = isNaN(num) ? min : num {amp}gt; max ? max : num {amp}lt; min ? min : num; }); 

http://jsfiddle.net/cha9t3g5/2

Используйте атрибуты min и max, и если вы хотите, чтобы пользователь вводил числа, укажите тип ввода как число, а не как текст …

 {amp}lt;input type="number" name ="name_u_want_to_give" min="1" max="31" maxlength="2" /{amp}gt; 

Пожалуйста, исправьте следующий код в соответствии с вашими требованиями.

 `{amp}lt;script type="text/javascript"{amp}gt; function minmax(value, min, max) { if(parseInt(value) {amp}lt; 0 || isNaN(value)) return 0; else if(parseInt(value) {amp}gt; 100) return 100; else return value; } {amp}lt;/script{amp}gt; {amp}lt;input type="text" name="textWeight" id="txtWeight" maxlength="5" onkeyup="this.value =minmax(this.value, 0, 100)"/{amp}gt;`