HTML5番号フィールドの末尾に0を表示させるにはどうすればよいですか？

Question

私はフィールドを持っている：

​​

私はそれが0.5に「それを修正する」なし0.50にパンチしたいと思いますので、それは0.50を表示していました。

Answer 1

私はこのことについて少し遊んでいて、仕様を見てきました。それは有効な浮動小数点数でなければならないと言います。数のn個の浮動小数点数が nにはJavaScript演算子ToStringメソッドを適用して得られた文字列 あるとして

最高の表現：私の注意を引いたことができますdefinition of a valid floating point numberで一つの文章があります。

これは、フォーマットは常に数字が何であるかを評価し、その数字にJavaScriptのtoStringを使用することと一貫していることを意味します。だから後続の0はない。

JavaScriptを使用する必要があります。 document.getElementById('numInput').value = '0.50';はまだ0.5に訂正されているため、妥当性検査はonchangeでトリガーされないため、デフォルトのアクションは防止され、内部的にトリガーされます。

これは、それがハッキングのビットだし、堅牢性のために微調整のビットを必要としますが、うまくいけば、それはあなたがやりたいよ...私が思い付くことができる最高のソリューションです：

var numInput = document.getElementById('numInput'); 
numInput.addEventListener('keypress', function() { 
    this.setAttribute('type', 'text'); 
}); 
numInput.addEventListener('click', function() { 
    this.setAttribute('type', 'number'); 
}); 

ユーザが入力して数字を入力したい場合は、入力タイプをテキストに切り替えますが、クリックすると番号に変換されます。

あなたは常に末尾の0は、どんなユーザーの種類、その後、あなたはそれをこのような何かできなかった場合：

var numInput = document.getElementById('numInput'); 
numInput.addEventListener('blur', function() { 
    if (this.value === '') { 
     return; 
    } 
    this.setAttribute('type', 'text'); 
    if (this.value.indexOf('.') === -1) { 
     this.value = this.value + '.00'; 
    } 
    while (this.value.indexOf('.') > this.value.length - 3) { 
     this.value = this.value + '0'; 
    } 
}); 
numInput.addEventListener('focus', function() { 
    this.setAttribute('type', 'number'); 
}); 

編集：私は第二の溶液は、どのようなユーザーとのより多くのインラインだと思うがユーザーが0.5と入力すると、0.50に強制的に変更されるので、それが必要かどうかによって異なります。

Answer 2

私はあなたがそれだけの数の文字列にそれをレンダリングし、floatにキャストし、値をとり、0の

$('.number-input').on('change', function(){ 
    $(this).val(parseFloat($(this).val()).toFixed(2)); 
}); 

末尾きたい入力にイベント（「変更」）に添付小数点以下の桁数を値として返します。