在HTML編號輸入上顯示尾隨小數點零位

我在移動Safari上顯示默認字段值「1.10」時遇到問題。由於最後一位數字是零，因此顯示爲「1.1」。我在桌面系統上沒有這個問題，只能在移動Safari上顯示。在HTML編號輸入上顯示尾隨小數點零位

如果我將默認值設置爲「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，這將切斷零點。

Showing 3 digits...GOOD

Showing 2 digits when I want to show 3...BAD

你可以自己在EZMonthlyPayment.com您的桌面和iOS設備上進行測試。

來源

2012-11-12 Michael McVerry

更新：能夠通過更改而不是 ...來進行bandaid ...但是我寧願保留它是數字，因爲它在移動設備上提供了正確的鍵盤。就像我剛纔說的，只是一個繃帶... –

你可以使用JavaScript的方式偷偷摸摸位交換文本和數字類型的輸入：

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

這只是從這裏這個真的不好回答服用，也可以有其他的解決方案，您的問題（雖然我不知道它是否適用於移動Safari瀏覽器）：How can I make the HTML5 number field display trailing zeroes?

來源

2012-12-19 14:00:04 Luke

令人驚訝的是，經過多年的準備HTML5，我們仍然處理這樣的明顯缺陷。 – brushleaf

在HTML編號輸入上顯示尾隨小數點零位

回答

相關問題