Можете ли вы шаг "1,00" вместо просто 1 в номер типа ввода?

Question

Я использую ввод бумаги Polymer и хочу, чтобы мой ввод type="number" всегда показывал 2 десятичных знака, в том числе, когда это целое число.

Поэтому вместо значения по умолчанию, равного 1, я хочу всегда показывать его как 1.00.Я получил бумажный ввод step="1" или даже step="0.01", но каждый раз, когда значение является целым числом, оно не будет отображаться 1.00

<paper-input id="taxPercent" min="0" max="99" step="1.00" on-change="_onVariablesChanged" value="0.00"> Tax Percent</paper-input>

_onVariablesChanged: function (event){
 let value = event.target.value; 
 value = parseFloat(value).toFixed(2);
}

Answer 1

Когда ввод обновляется, проверьте, найден ли . в значении.

• Если это так, не нужно что-то менять.
• Если нет, добавьте .00 в конце.

document.addEventListener('DOMContentLoaded', () => {
  document.querySelector('input').addEventListener('input', update);
});

function update() {
  if (/\./.test(this.value) === false) {
    this.value = `${this.value}.00`;
  }
}

<input type="number" step="0.01">

Answer 2

Вы можете использовать прослушиватель событий для определения изменения значения. input.value будет строкой, но добавление + преобразует ее в число. Числа имеют метод toFixed() ( mdn ), который форматирует числа так, чтобы они содержали определенное число десятичной точности.

const input = document.querySelector('input');
input.addEventListener('input', () =>
  input.value = (+input.value).toFixed(2));

<input type="number" min="1">