почемуне работает в Safari? - PullRequest
       5

почемуне работает в Safari?

33 голосов
/ 20 февраля 2012

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

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

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

РЕДАКТИРОВАТЬ:

с этим этоработающий

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

ответ: Как я могу запретить буквы внутри текстового элемента?

Ответы [ 7 ]

31 голосов
/ 21 февраля 2012

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

<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]*/));
});
13 голосов
/ 24 ноября 2016

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

<input type="text" maxlength="3" oninput="this.value=this.value.replace(/[^0-9]/g,'');" id="myId"/>
4 голосов
/ 21 февраля 2012

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

1 голос
/ 17 марта 2016

Я использовал что-то очень похожее на ответ @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" />
0 голосов
/ 27 декабря 2017

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

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

Happy Coding:)

0 голосов
/ 12 мая 2017

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, '');
  });
}
0 голосов
/ 27 марта 2017

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

<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 предотвратит "." (Точку), поэтому нельзя войти в число с плавающей точкой. Мы сохраняем тип ввода как число, так что в качестве ввода будет только число. Если значение равно 3, оно вернет false, поэтому длина ввода также ограничена.

...