Не удалось установить свойство maxlength для числового поля в HTML5

Это текстовое поле. См... Я устанавливаю свойство maxlength равным 10. Таким образом, можно ввести только 10 символов

<input maxlength="10" id="txt_name" name="txt_name" type="text" required="required"/>

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

 <input id="txt_mob" name="txt_mob" type="number" maxlength="10"/>

Но функция maxlength работает с числовыми полями. Зачем?? Есть ли способ сделать это без использования Javascript или jQuery?

Здесь FIDDLE.

+4
09 окт. '14 в 9:56
источник поделиться
5 ответов

тип номера не принимает атрибут maxlength. вы можете попробовать это

поместите текст в текст и используйте его.

этот script принимает только ввод чисел, помещает его в начало вашей страницы.

<script>
function isNumber(event) {
  if (event) {
    var charCode = (event.which) ? event.which : event.keyCode;
    if (charCode != 190 && charCode > 31 && 
       (charCode < 48 || charCode > 57) && 
       (charCode < 96 || charCode > 105) && 
       (charCode < 37 || charCode > 40) && 
        charCode != 110 && charCode != 8 && charCode != 46 )
       return false;
  }
  return true;
}
</script>

затем используйте это в поле ввода

onkeydown="return isNumber(event);"

Пример

<input type="text" onkeydown="return isNumber(event);" maxlength="10" />
+1
09 окт. '14 в 10:06
источник

Для входных элементов номера типа вы не можете использовать maxlength, этот атрибут предназначен только для строк. Для чисел вы можете использовать min = "0" и max = "10". Здесь вы можете увидеть пример:

http://www.w3schools.com/tags/att_input_max.asp

0
09 окт. '14 в 10:02
источник

Из mdn,

Если значением атрибута type является текст, адрес электронной почты, поиск, пароль, tel или url, этот атрибут определяет максимальное количество символов (в кодовых точках Unicode), которые пользователь может ввести; для других типов управления он игнорируется.

Таким образом, maxlength игнорируется на

     <input type="number">

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

     <input type="text" pattern="([0-9]{3})" maxlength="4">

Надеюсь, это поможет некоторым...

0
09 окт. '14 в 10:53
источник

Для ввода номера необходимо использовать свойство min/max:

<input type="number" id="txt_mob" name="txt_mob" min="1" max="5">

Вы можете увидеть пример на веб-сайте w3schools:

http://www.w3schools.com/tags/att_input_max.asp

0
09 окт. '14 в 10:02
источник

Вы можете использовать <input type="number" name="quantity" min="1" max="9999999999">

0
09 окт. '14 в 10:05
источник

Посмотрите другие вопросы по меткам или Задайте вопрос