Rectangle 27 1

html5 why is input type="number" maxlength="3" not working in Safari?


$("#myField").keyup(function() {
    $("#myField").val(this.value.match(/[0-9]*/));
});
<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>
inputmode=numeric

I think you can use [0-9]{3} instead of [0-9][0-9][0-9] in your pattern (I know it works in Chrome at least).

Remove the pattern attribute if you are going to use the javascript code.

This is nice in iOS but on android the keyboard still shows up as text, not numbers.

and then in JavaScript I prevented the letters:

the spec is idiotic, the fact that we need to change from type="number" to type="text" with pattern and javascript is ridiculous

Note
Rectangle 27 1

html5 why is input type="number" maxlength="3" not working in Safari?


$("#myField").keyup(function() {
    $("#myField").val(this.value.match(/[0-9]*/));
});
<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>
inputmode=numeric

I think you can use [0-9]{3} instead of [0-9][0-9][0-9] in your pattern (I know it works in Chrome at least).

Remove the pattern attribute if you are going to use the javascript code.

This is nice in iOS but on android the keyboard still shows up as text, not numbers.

and then in JavaScript I prevented the letters:

the spec is idiotic, the fact that we need to change from type="number" to type="text" with pattern and javascript is ridiculous

Note
Rectangle 27 1

html5 why is input type="number" maxlength="3" not working in Safari?


Basically Max and Min properties are not supported in Safari browser yet. I can see no flaw in the syntax. Are u using the Safari version 1.3+? or below that? Because maxlength property is supported from safari 1.3+.

Note
Rectangle 27 1

html5 why is input type="number" maxlength="3" not working in Safari?


Basically Max and Min properties are not supported in Safari browser yet. I can see no flaw in the syntax. Are u using the Safari version 1.3+? or below that? Because maxlength property is supported from safari 1.3+.

Note
Rectangle 27 1

html5 why is input type="number" maxlength="3" not working in Safari?


<input type="text" maxlength="3" oninput="this.value=this.value.replace(/[^0-9]/g,'');" id="myId"/>

You may try to user type="text" and oninput as below. This will let the numbers only.

Note
Rectangle 27 1

html5 why is input type="number" maxlength="3" not working in Safari?


<input type="text" maxlength="3" oninput="this.value=this.value.replace(/[^0-9]/g,'');" id="myId"/>

You may try to user type="text" and oninput as below. This will let the numbers only.

Note
Rectangle 27 0

html5 why is input type="number" maxlength="3" not working in Safari?


$("#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" />

I used something very similar to @Jules answer except his won't allow the use of keys like shift+home. Since we're validating numbers I just used isNaN in the keyup function.

Note
Rectangle 27 0

html5 why is input type="number" maxlength="3" not working in Safari?


$("#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" />

I used something very similar to @Jules answer except his won't allow the use of keys like shift+home. Since we're validating numbers I just used isNaN in the keyup function.

Note