js限制文本框只能輸入數(shù)字(正則表達式)
更新時間:2012年07月15日 23:08:06 作者:
讓文本框只能輸入數(shù)字也是我們非常常用的一種功能,很多程序中涉及的例如財務(wù)、銷售等等領(lǐng)域的地方,想要限制用戶的輸入是非常必要的,如果不能限制用戶的輸入內(nèi)容的合法性,輕則系統(tǒng)異常,重則數(shù)據(jù)錯誤,所以對用戶輸入域的合法性驗證或限制不容小覷
好了,言歸正傳。話說我在網(wǎng)上找了很多限制文本框的辦法都不盡人意,于是只好自己動手實踐了,實踐出真知嘛,這句話沒錯的。
function chkPrice(obj){
obj.value = obj.value.replace(/[^\d.]/g,"");
//必須保證第一位為數(shù)字而不是.
obj.value = obj.value.replace(/^\./g,"");
//保證只有出現(xiàn)一個.而沒有多個.
obj.value = obj.value.replace(/\.{2,}/g,".");
//保證.只出現(xiàn)一次,而不能出現(xiàn)兩次以上
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
function chkLast(obj){
// 如果出現(xiàn)非法字符就截取掉
if(obj.value.substr((obj.value.length - 1), 1) == '.')
obj.value = obj.value.substr(0,(obj.value.length - 1));
}
下面是需要調(diào)用的文本框:
<input type="text" name="txtFee" id="txtFee" class="common" onkeyup="chkPrice(this);" onblur="chkLast(this)" onpaste="javascript: return false;"/>
最后這個:onpaste="javascript: return false;" 的目的是禁用鼠標右鍵的“粘貼”菜單,可以防止鼠標右鍵或者Ctrl + V粘貼不合法的數(shù)據(jù),嘿嘿。
上面這段JS我只在IE8環(huán)境測試過,如果各位看官有什么想法或者疑問,請留言。
復(fù)制代碼 代碼如下:
function chkPrice(obj){
obj.value = obj.value.replace(/[^\d.]/g,"");
//必須保證第一位為數(shù)字而不是.
obj.value = obj.value.replace(/^\./g,"");
//保證只有出現(xiàn)一個.而沒有多個.
obj.value = obj.value.replace(/\.{2,}/g,".");
//保證.只出現(xiàn)一次,而不能出現(xiàn)兩次以上
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
function chkLast(obj){
// 如果出現(xiàn)非法字符就截取掉
if(obj.value.substr((obj.value.length - 1), 1) == '.')
obj.value = obj.value.substr(0,(obj.value.length - 1));
}
下面是需要調(diào)用的文本框:
復(fù)制代碼 代碼如下:
<input type="text" name="txtFee" id="txtFee" class="common" onkeyup="chkPrice(this);" onblur="chkLast(this)" onpaste="javascript: return false;"/>
最后這個:onpaste="javascript: return false;" 的目的是禁用鼠標右鍵的“粘貼”菜單,可以防止鼠標右鍵或者Ctrl + V粘貼不合法的數(shù)據(jù),嘿嘿。
上面這段JS我只在IE8環(huán)境測試過,如果各位看官有什么想法或者疑問,請留言。
相關(guān)文章
javascript寫的一個表單動態(tài)輸入提示的代碼
javascript寫的一個表單動態(tài)輸入提示的代碼...2007-08-08js監(jiān)聽表單value的修改同步問題,跨瀏覽器支持
今天同事測試發(fā)現(xiàn)項目中一個小bug,然后我負責解決。研究了不短的時間,終于搞定了,有點激動。呵呵。拿出來與大家分享。2009-12-12對textarea框的代碼調(diào)試,而且功能上使用非常方便,酷
對textarea框的代碼調(diào)試,而且功能上使用非常方便,酷...2006-06-06用javascript實現(xiàn)改善用戶體驗之a(chǎn)lert提示效果
用javascript實現(xiàn)改善用戶體驗之a(chǎn)lert提示效果...2007-10-10