Jak ograniczyć dane wejściowe użytkownika do określonej długości w HTML5input[type=number] pole tekstowe?

odpowiedzi na

Jak mogę ograniczyć możliwe dane wejściowe w elemencie „numer” HTML5?

nie obsługuj nielegalnych danych wejściowych

<input class="quantity" type="number" min="0" max="99999" maxlength="5" />

$("quantity").keyup(function(){
    var $field = $(this);
    if ($field.val().length > Number($field.attr("maxlength"))) {
        var value = $field.val().slice(0, 5);
        $field.val(value);
    }
});

Wiem, że atrybut maxlength nie jest obsługiwany, ale używam go do uzyskania podanej długości.

Powyższy kod działa poprawnie w firefox, ale w chrome i safari działa tylko wtedy, gdy wprowadzę pięć znaków „VALID”. Kiedy zaczynam wpisywać nieprawidłowe znaki, np. „a”, „b” itp., mogę wpisać więcej liter, a kolor pola tekstowego zmieni się na czerwony.

Odkryłem, że gdy wejście stanie się niepoprawne$field.val() zwraca zawsze pusty łańcuch i$field.val().length zwraca0.

Próbowałem nawet przekonwertować kod keyCode na znak przeznaczony do wprowadzania i przechowywania go w atrybucie „wartość-danych” do pola wprowadzania, aby sprawdzić i nadpisać wartość wejścia, ale nie wydawało się to być wiarygodne.

Czy jest jakieś rozwiązanie, z którego mogę zrobićinput[type=number] zachowuj się tak jakinput[type=text][maxlength=5]?