Почему <input type = "number" maxlength = "3" > не работает в Safari?

Мне нравится вводить максимум 3 символа. В Firefox все работает отлично, я могу написать только 3 числа внутри входа, но в сафари вы можете написать много чисел внутри.

Вы можете протестировать его в обоих браузерах следующим образом: http://flowplayer.org/tools/demos/validator/custom-validators.htm

На данный момент я понял это с помощью плагина validate, но только для интереса, который мне нравится знать, почему это не работает?

EDIT:

с этим он работает

<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>

answer: Как предотвратить письма внутри текстового элемента?

+29
20 февр. '12 в 12:34
источник поделиться
7 ответов

Я сделал это с помощью:

<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>

а затем в JavaScript я запретил буквы:

$("#myField").keyup(function() {
    $("#myField").val(this.value.match(/[0-9]*/));
});
+29
21 февр. '12 в 6:56
источник

Вы можете попробовать ввести user type = "text" и oninput, как показано ниже. Это позволит только номера.

<input type="text" maxlength="3" oninput="this.value=this.value.replace(/[^0-9]/g,'');" id="myId"/>
+8
24 нояб. '16 в 16:31
источник

В основном свойства Макс и Мин не поддерживаются в браузере Safari. Я не вижу недостатков в синтаксисе. Используете ли вы версию Safari версии 1.3+? или ниже этого? Поскольку свойство maxlength поддерживается из Safari 1.3 +.

+4
21 февр. '12 в 5:28
источник

Я использовал что-то очень похожее на @Jules, за исключением того, что его не разрешат использовать ключи, такие как shift + home. Поскольку мы проверяем числа, я просто использовал isNaN в функции keyup.

$("#myField").keyup(function() {
    var e = $("#myField");
    if(isNaN(e.val())){
        e.val(e.val().match(/[0-9]*/));
    }
});

С...

<input id="#myField" inputmode="numeric" maxlength="3" pattern="([0-9]{3})" type="text" />
+1
16 мар. '16 в 21:29
источник

Вот более простое решение. Для меня это сработало

<input type="number" id="cvv">


$("#cvv").on("keypress", function(evt) {
  var keycode = evt.charCode || evt.keyCode;
  if (keycode == 46 || this.value.length==3) {
    return false;
  }
});

блок JS предотвратит "." (точка), чтобы один из них не мог поместить float. Мы сохраняем тип ввода как число, поэтому он будет только номером в качестве входного. Если длина значения равна 3, то она вернет значение false, поэтому длина ввода также будет ограничена.

0
27 мар. '17 в 11:58
источник

Использование длины onKeyDown может быть ограничено

<input type="number" onKeyDown="if(this.value.length==10 && event.keyCode!=8) return false;">

Счастливое кодирование:)

0
27 дек. '17 в 13:17
источник

https://jsfiddle.net/zxqy609v/8/

function fixMaxlength(inputNumber) {
  var maxlength = $(inputNumber).attr("maxlength");
    $(inputNumber).keyup(function (evt) {
    this.value = this.value.substring(0, maxlength);
    this.value = this.value.replace(/\D/g, '');
  });
}
-1
12 мая '17 в 2:34
источник

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