JSFiddle - React, Tailwind, and code Playground

by Daniel Lizik

HTML

<textarea id="descr" maxlength="5"></textarea>
<button>submit comments</button>
characters remaining: 
<span id="descr-charCount"></span>
<span id="descr-countWarning"></span>

JavaScript

//http://stackoverflow.com/questions/5533053/textarea-character-limit

(function() {
    'use strict';    
    function maxLength(obj) {
        if ('maxLength' in obj.el) {
            var max = obj.el.attributes.maxLength.value;            
            obj.el.onkeyup = function (e) {
                var curr = obj.el.value.length;
                obj.disp.textContent = max - curr;
                if (this.value.length >= max) {
                    obj.warn.textContent = obj.warnText; 
                    return false;
                } 
                if (this.value.length < max) obj.warn.textContent = "";
            };
        }
    }
    maxLength({
        el: document.getElementById("descr"),
        disp: document.getElementById("descr-charCount"), 
        warn: document.getElementById("descr-countWarning"),
        warnText: "please submit full text as separate attachment"
    });
})();