您可以在输入类型编号中输入“1.00”而不是 1 吗？

Question

我正在使用 Polymer 纸张输入，我想让我的 type="number" 输入始终显示 2 个小数点，包括当它是整数时。

因此，我希望始终将其显示为 1.00，而不是默认的 1。我得到了step="1"甚至step="0.01"的paper-input，但是每次值都是整数时，它不会显示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">

您可以在输入类型编号中输入“1.00”而不是 1 吗？

Can you step "1.00" instead of just 1 in input type number?

html

javascript

polymer-1.0