将HTML5数字字段增加.5,步长为.01

(function() {
  var numberFields = document.querySelectorAll("input[type=number]"),
    len = numberFields.length,
    numberField = null;

  for (var i = 0; i < len; i++) {
    numberField = numberFields[i];
    numberField.onclick = function() {
      this.setAttribute("step", ".5");
    };
    numberField.onkeyup = function(e) {
      if (e.keyCode === 38 || e.keyCode === 40) {
        this.setAttribute("step", ".01");
      }
    };
  }
}());

<input type="number" step=".01">

let input = document.getElementById('addNum');
increment = 0.5;

input.onkeydown = function(e){
  if(e.key == "ArrowUp"){
    e.preventDefault();
    let value = +this.value;
    this.value = value + increment;
  } else if(e.key == "ArrowDown"){
    e.preventDefault();
    let value = +this.value;
    this.value = value - increment;
  }
}

input:valid {
  border-color: #0f0;
}
input:invalid {
  border-color: #f00;
}
input {
  outline: none;
}

Enter a (non-negative) number:
<input type="text" pattern="\d*[.]*\d{0,3}" id="addNum">