html5 input number類型使用整理


  一、  html5 input中的數字number類型

只能輸入整數,如果要輸入浮點數呢,可以通過maxminstep去定義。

        type="number" 數字類型

        min="0" 最小值

        min="100" 最大值

        step="1"  點擊右邊上下按鈕每次增加或減少的值

 

1.默認整數

<input type="number"  min="0" max="100" />

2.浮點類型

    在屬性值后增加小數位數定義浮點類型數據的輸入

<input type="number"  min="0.00" max="100.00" step="0.01"  />

 

如圖,整數框和浮點數框:

 

 

二、解決 html5 input type='number' 類型可以輸入e

當給 input 設置類型為 number 時,比如,我想限制,只能輸入 0-9 的正整數,正則表達式如下:

/^[0-9]?$/ // 匹配 0-9 的整數且只匹配 0 次或 1 次
用正則測試,小數點是無法通過的,且,因為 設置了類型為 number,也無法輸入字母,

但實際上,1. 類似這樣的不合規則的數字是可以通過驗證的,且,可以鍵入字母 e,因為 e 在數學上代表2.71828,也是一個數字。

解決辦法如下:

<input type='number' οnkeypress='return( /[\d]/.test(String.fromCharCode(event.keyCode) ) )' />

這樣,就不能輸入 e 或者 小數點了

 

更多:

屏幕方向讀取與鎖定:Screen Orientation API(轉)

蘋果手機微信瀏覽器select標簽選擇完成之后頁面不會自動回到原位

HTML5 Selection對象


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM