Is there a workaround for text input maxlength not working in Safari?

Question

In safari version 8.0 (10600.1.25.1) on OS X 10.10.1 if you have the following:

<input type="text" maxlength="5" >

Fill it with 5 characters, and then position the caret (with the mouse or keyboard) somewhere in the middle of the string (not at the very beginning or end), typing will cause more characters to be entered.

Specifically, it acts like it is ignoring the characters after the caret when calculating the "length" of the string, so if the caret was originally placed at position 1, 9 more characters will be enterable.

This is not reproducible on the latest chrome or firefoxes.

The effect can be seen on this page: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_input_maxlength

Am I using maxlength wrong? Is this a known thing with workarounds? I've googled a bit with no joy...

Answer 1

Try this: HTML :

<input name="mytest" type="text">

Jquery :

$('input[name="mytest"]').keypress(function() {
    if (this.value.length >= 5) {
        return false;
    }
});