JSFiddle - React, Tailwind, and code Playground

by alexflav23

HTML

<input type="text" id="test" value=""/>
        <div id="output" style="width:800px;height:400px;font-size:13px;color:#000"></div>

JavaScript

function isNumber(value) {
                return !isNaN(parseFloat(value)) && isFinite(value);
            };
            
            function decimalPlaces(num) {
              var match = (''+num).match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
              if (!match) { return 0; }
              return Math.max(
                   0,
                   // Number of digits right of decimal point.
                   (match[1] ? match[1].length : 0)
                   // Adjust for scientific notation.
                   - (match[2] ? +match[2] : 0));
            }

            function testNumber(value) {
                var target = document.getElementById("output");
                if (!isNumber(value)) {
                    target.innerHTML += "<p>Input: " + value +" A number must go in here</p>";
                } else {
                    var noDecimals = decimalPlaces(value);
                     target.innerHTML += "<p>Number of decs: " + noDecimals + "</p>";
                    if (noDecimals != 2) {
                        target.innerHTML += "<p>Input: " + value + "You can only use two decimals</p>";
                    } else {
                        target.innerHTML += "<p>Input: " + value +"Thanks user, good choice of number</p>";
                        // now do something with the value.
                    };
            
                };
            };
var input = document.getElementById("test");
test.addEventListener("keyup", function(event) {
    testNumber(event.target.value);
}, false);