HTML番号入力時に末尾の10進数ゼロを表示する

Question

モバイルSafariでデフォルトのフィールド値 "1.10"を表示するのに問題があります。最後の桁は0なので、 "1.1"と表示されます。私はデスクトップシステムでこの問題を抱えていないし、モバイルサファリにのみ表示されています。

デフォルト値を「1.11」に設定すると、すべての数字が表示されますが、「1.10」は「1.1」と表示されます。 Mobile Safariにデフォルトのフォーム値として「1.10」を表示させるにはどうすればよいですか？

これは私のコードです。

 <label id="mortIns_lbl" for=mortIns>Mortgage Ins. (PMI):</label><div class="dollar">$</div> 
     <input id=mortIns class=narrow name=mortIns type=text readonly> 
     <input class="percent necessary" id=miPerc name=miPerc type=number onblur=loan() min="0" 
       max="3" 
       step=".01" 
       value="1.10"><div class="pct">%</div><a title="Most mortgage banks will require mortgage insurance if the down payment is less than 20% of the total purchase price of the property. Once 20-25% of the principal has been payed down, the PMI should be removed. However, until that happens, the mortgage insurance payment will remain. 1.1% is the average, but for further clarification talk to a professional lender.">?</a> 
     </li> 

そしてここで（Xcodeのエミュレータを介して）モバイルSafariで問題を示すスクリーンショットである

最初の画像は、適切な数字を示す、デフォルト値として1.11のセットを示します。次に、1.10として設定すると、ゼロがカットされます。

あなたは、デスクトップとiOSデバイス上でEZMonthlyPayment.comで、この自分自身をテストすることができます。

Answer 1

あなたがテキストや数値型間の入力を交換するためにJavaScriptの卑劣なビットを使用することもできます。これはちょうどここにこれは本当に良い答えから取られ

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

、それはあなたの問題を他のソリューションを有していてもよい（が、 How can I make the HTML5 number field display trailing zeroes?