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

Question

I like to have an input with maximum 3 characters. In Firefox everything works fine I can only write 3 numbers inside the input - but in safari you can write a lot of numbers inside.

You can test it in both browsers with this: http://flowplayer.org/tools/demos/validator/custom-validators.htm

For now I realized it with a validate plugin - but just for interest I like to know why isn’t this working?

EDIT:

with this it's working

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

answer: How can I prevent letters inside a text element?

Answer 1

I've accomplished it with:

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

and then in JavaScript I prevented the letters:

$("#myField").keyup(function() {     $("#myField").val(this.value.match(/[0-9]*/)); }); 

Answer 2

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

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