JSFiddle - React, Tailwind, and code Playground

by Noreh AD

HTML

<input type="number" id="inputBox" min="0" max="255" step="1" />

JavaScript

var inputBox = document.getElementById("inputBox");

inputBox.addEventListener("input", function () {
  if (this.validity.rangeUnderflow) {
    this.value = this.min;
  }
  else if (this.validity.rangeOverflow) {
    this.value = this.max;
  }

  // this.value = this.valueAsNumber;
});

inputBox.addEventListener("keydown", function (e) {
  if (!isFloat(this.step)) {
    if (e.key == ".") {
      e.preventDefault();
    }
  }
});

function isFloat(f) {
  var f		 = parseFloat(f);
  var floor	 = Math.floor(f);
  var fraction = f - floor;
  if (fraction > 0) {
    return true;
  }
  return false;
}