怎么限制input的text里輸入的值只能是數(shù)字(正則、js)
更新時間：2016年05月16日 13:46:04 作者：newbie
這篇文章主要通過正則表達(dá)式和JS代碼限制input的text里輸入的值只能是數(shù)字的相關(guān)資料,需要的朋友可以參考下
當(dāng)我們在一些網(wǎng)站注冊賬號、填寫信息是，不小心將電話號碼填寫成漢字或其他英文字母了，這顯然是不正確的。為了幫助用戶更好地糾正輸入時的錯誤，在表單中填寫信息時，需要限制手機號、郵編、電話號碼這類文本框不能輸入其他字符，只能是數(shù)字。
通過使用正則匹配輸入的時候只是數(shù)字：
復(fù)制代碼 代碼如下:
var numRegex = /\D/g
再通過JavaScript的onblur 事件：
定義和用法
onblur 事件會在對象失去焦點時發(fā)生。
Onblur 經(jīng)常用于Javascript驗證代碼，一般用于表單輸入框
語法
HTML 中:
復(fù)制代碼 代碼如下:
<element onblur="SomeJavaScriptCode">
JavaScript 中:
object.onblur= function(){
//操作
myScript;
}
JavaScript 中, 使用 addEventListener() 方法:
復(fù)制代碼 代碼如下:
object.addEventListener('blur',myScript);
最終DEMO代碼：
var numRegexFn = function(obj){
obj.value = obj.value.replace(numRegex,'');
if(!obj.value){
alert('請輸入數(shù)字');
}else{
alert('pass');
}
}
phone.onblur = function(){
numRegexFn(this);
}
以上所述是小編給大家介紹的使用正則表達(dá)式和js限制只能輸入數(shù)字的相關(guān)內(nèi)容，希望對大家有所幫助，也希望大家多多的關(guān)注腳本之家網(wǎng)站！
您可能感興趣的文章:
相關(guān)文章
JS表單提交驗證、input（type=number） 去三角 刷新驗證碼
在進行表單提交時，需要對輸入框和文本域等的value的合理性進行驗證，可以編寫form的onSubmit事件，下面給大家介紹js表單提交驗證input（type=number） 去三角 刷新驗證碼注意事項，一起看看吧2017-06-06
JavaScript深度復(fù)制（deep clone）的實現(xiàn)方法
本文給大家介紹JavaScript深度復(fù)制（deep clone）的實現(xiàn)方法，涉及到j(luò)s深度復(fù)制相關(guān)知識，本文介紹的非常詳細(xì)，特此分享腳本之家平臺供大家參考2016-02-02
這篇文章主要給大家介紹了光宇微信小程序單頁面應(yīng)用路由的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
這篇文章主要給大家介紹了js簡單粗暴的發(fā)布訂閱的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01
js對數(shù)組中的數(shù)字從小到大排序?qū)崿F(xiàn)代碼
對數(shù)組中的數(shù)字從小到大排序，很多時候需要用的多，需要的朋友可以參考下2012-09-09
這篇文章主要給大家介紹了關(guān)于js如何獲取圖片url的Blob值并預(yù)覽的相關(guān)資料，文中通過示例代碼以及圖文介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
今天小編就為大家分享一篇layui輸入框只允許輸入中文且判斷長度的例子，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
這篇文章主要介紹了詳解可以用在VS Code中的正則表達(dá)式小技巧，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-05-05
這篇文章主要為大家詳細(xì)介紹了微信通過頁面(H5)直接打開本地app的解決方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-09-09
這篇文章主要介紹了uni-app 組件里面獲取元素寬高的實現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12