Android maxlength polyfill

by villard

HTML

<input type="text" maxlength="7">
<br><br>
<textarea name="" id="" cols="30" rows="2" maxlength="50"></textarea>

JavaScript

function fixMaxlength() {
    var selector = 'input[maxlength], textarea[maxlength]';
    var inputs = document.querySelectorAll(selector);

    for (var j = 0; j < inputs.length; j++) {
        inputs[j].addEventListener('input', function(evt) {
            var target = evt.target;
            var maxlength = target.getAttribute('maxlength');
            if(target.value < maxlength) {
                return;
            } else {
                target.value = target.value.substring(0, maxlength);
            }
        }, false);
    }
}


var platform = (function () {
    var isMaxTouchPoints = !!navigator.maxTouchPoints;
    var isOntouchstart = 'ontouchstart' in document.documentElement;
    return {
        isTouch: isMaxTouchPoints || isOntouchstart,
        isAndroid: /Android/i.test(navigator.userAgent),
        isLinux: /Linux/i.test(navigator.userAgent)
    }
})();

window.addEventListener('load', function() {

    // Android or Android desktop view
    if(platform.isAndroid || (platform.isTouch && platform.isLinux)) {
        fixMaxlength();
    }

}, false);