html5 input[number]類型輸入非數字字符val()為“”和解決方案


html5新增的number輸入類型會在input框獲得焦點的時候呼起數字鍵盤,增加了體驗的效果。但是在一些安卓機器上,還是能夠切換道字符輸入,用戶也會不小心輸入“+”“—”之類的非數字字符。測試了一下,number類型是會自動忽略字母字符和其他非數字字符的,除了“+”“—”“.”這兩個字符可以輸入,因為這兩個是正負數和小數點的符號。

number類型還有一個很坑的點是,如果輸入框中的內容不是純數字(正數,負數都行),內容中包含一些字符的時候,對應dom元素的value就是空("")。

因此無論是原生的document.getElementById("txt").value還是jq的$('selector').val()得到的都是空。

這個問題很難解決,即使是keyup和keypress監聽輸入框也會遇見。

我做的需求是要求不能夠輸入小數,即是不能輸入數字以外的字符。輸入以后就把字符刪除。

我的做法是用正則表達式檢測出輸入了字符,把最后一個字符去掉。用keyup監聽。

keyup/keypress監聽在輸入小數點或者+—符的當下是感知不到的,即是dom的value沒有改變。在符號后再輸入數字字符時才能通過value得知。

$("#moneyInput").on("keyup", function(e) {
var obj = $("#moneyInput"),
value = obj.val();
if (!(/(^\+?[1-9][0-9]*$)/.test(value))) {
value = value.substring(0,value.length-1);
// obj.val("");
obj.val(value);
}
});

 


免責聲明!

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



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