html - HTML数値入力で常に小数点以下2桁を表示するようにする

Question

ユーザーがhtml番号入力タグを使用して金額を入力できるフォームを作成しています。入力ボックスに常に小数点以下2桁を表示させる方法はありますか？

Answer 1

したがって、他の誰かがこれに出くわした場合、この問題に対する JavaScript ソリューションを次に示します。

ステップ 1: HTML 数値入力ボックスをonchangeイベントにフックする

myHTMLNumberInput.onchange = setTwoNumberDecimal;

または必要に応じてhtmlコードで

<input type="number" onchange="setTwoNumberDecimal" min="0" max="10" step="0.25" value="0.00" />

ステップ 2: setTwoDecimalPlace メソッドを記述する

function setTwoNumberDecimal(event) {
    this.value = parseFloat(this.value).toFixed(2);
}

必要に応じて、「2」を変更することで、toFixed小数点以下の桁数を増減できます。

Answer 2

ここで受け入れられた解決策は正しくありません。HTMLでこれを試してください：

onchange="setTwoNumberDecimal(this)" 

関数は次のようになります。

 function setTwoNumberDecimal(el) {
        el.value = parseFloat(el.value).toFixed(2);
    };

Answer 3

純粋な html では、やりたいことができません。私の提案は、単純な javascript 関数を記述して、ラウンドニングを行うことです。

Answer 4

toFixedでJavascript番号を調べてください。入力でtoFixedを呼び出し、新しい値を設定するonChange関数を数値フィールドに記述できます。