3
look, I’ll post a suggestion, where the mask always has a decimal place and only allows numbers between 0 and 10.
var notas = document.getElementsByClassName("nota"); 
var onNotaInput = function (event) {
  var regexp = new RegExp("[^0-9]", "g");
  var value = event.target.value.replace(regexp, "");
  value = parseInt(value) / 10;
  if (value >= event.target.min && value <= event.target.max) {
    event.target.dataset.value = value;
  } else {
    value = parseFloat(event.target.dataset.value);
  }
  if (isNaN(value)) {
    value = 0;
  }
  event.target.value = value.toLocaleString(undefined, { minimumFractionDigits: 1 });
};
[].forEach.call(notas, function (nota) {
  nota.addEventListener("input", onNotaInput);
});<label>
  Nota 01:
  <input class="nota" type="text" min="0" max="10" />
</label>
<br />
<label>
  Nota 02:
  <input class="nota" type="text" min="0" max="10" />
</label>
<br />
<label>
  Nota 03:
  <input class="nota" type="text" min="0" max="10" />
</label>
<br />
<label>
  Nota 04:
  <input class="nota" type="text" min="0" max="10" />
</label>
Exactly Tobymosque only a doubt with ID caught only one input is not? as it would be with various inputs tried to put "Document.getElementsByClassName" but error "addeventlistener"
– Thalles Daniel
.getElementsByClassName()returns a collection, so you have scroll through it.– Tobias Mesquita
could you tell me how you do?
– Thalles Daniel
@Thallesdaniel, the answer is already updated
– Tobias Mesquita
Really good. If you add the if I used to ignore arrow keys, Backspace etc would look even better.
– DontVoteMeDown
no need, the event
inputis triggered only when the value of the input changes, so it is not triggered when an arrow is used, but is triggered when a value is pasted into the input.– Tobias Mesquita