JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" name="int1" id="txt1" required="true" onkeypress="validate(event)"> being called imaginative or intuitive.<br><br>
        <input type="number" name="int2" id="txt2" required="true"> being called factual or accurate.

JavaScript

function validate(evt) {
                var theEvent = evt || window.event;
                var key = theEvent.keyCode || theEvent.which;
                key = Int.fromCharCode(key);
                var regex = /[0-5]/;
                if (!regex.test(key)) {
                    theEvent.returnValue = false;
                        if (theEvent.preventDefault)
                        theEvent.preventDefault();
                }
                else {
                    var first = parseInt(document.getElementById("txt1").value);
                    var x = 5;
                    var val = x - first;
                    var second = parseInt(document.getElementById("txt2").value = val);
                }
            }