jQuery使用正則表達(dá)式限制文本框只能輸入數(shù)字
更新時(shí)間：2016年06月18日 11:29:40 作者：酷小孩
本文主要介紹jQuery中使用正則表達(dá)式限制文本框只能輸入數(shù)字的功能，希望能幫到大家，有需要的朋友可以參考一下。
網(wǎng)站中的一個(gè)小功能：要求用戶只能輸入16位數(shù)字。
試過javascript的方法：
如：一種方法：
//只允許輸入數(shù)字
function checkkey2(value, e) {
var key = window.event ? e.keyCode : e.which;
if ((key > 95 && key < 106) || (key > 47 && key < 60)) {
}
else if (key != 8) {
if (window.event) //IE
{
e.returnValue = false;
}
else //Firefox
{
e.preventDefault();
}
};
};
另一種方法：
用正則表達(dá)式限制只能輸入數(shù)字：
onkeyup="value=value.replace(/[^/d] /g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))"
上面的兩種方法我均用過，但多少都會(huì)出現(xiàn)一些問題，比如瀏覽器的兼容性問題，不能達(dá)到想要的效果等，所以，最后還是考慮用正則來自己寫。
直接貼代碼了，很簡單的正則表達(dá)式：
<head>
<meta http-equiv="x-ua-compatible" content="IE=EmulateIE7" />
<title></title>
<!-- http://www.cnblogs.com/babycool -->
<script src="../js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#xxxxxx").keyup(function () {
//如果輸入非數(shù)字，則替換為''，如果輸入數(shù)字，則在每4位之后添加一個(gè)空格分隔
this.value = this.value.replace(/[^\d]/g, '').replace(/(\d{4})(?=\d)/g, "$1 ");
})
});
</script>
</head>
<body>
限制只能輸入19個(gè)字符
<input id="xxxxxx" type="text" name="name" value="" maxlength="19" />
<br />
<br />
輸入非數(shù)字替換為''
<input type="text" name="name" value="" onkeyup="value=value.replace(/[^\d]/g,'')" />
<br />
<br />
</body>
頁面效果：
瀏覽器的兼容性：
我在IE7.8.9.10下，firefox，chrome下測試均可以。
以上就是本文的全部內(nèi)容，希望這個(gè)方法也能給遇到相同問題的其他人帶來幫助，也希望大家多多支持腳本之家。
相關(guān)文章
不錯(cuò)的用jquery實(shí)現(xiàn)的，字符串截取功能實(shí)現(xiàn)代碼。2009-06-06
jQuery實(shí)現(xiàn)對(duì)無序列表的排序功能(附demo源碼下載)
這篇文章主要介紹了jQuery實(shí)現(xiàn)對(duì)無序列表的排序功能,涉及jQuery與javascript常見的文本操作函數(shù)與sort排序函數(shù)的相關(guān)使用方法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
easyui下拉框動(dòng)態(tài)級(jí)聯(lián)加載的示例代碼
本篇文章主要介紹了easyui下拉框動(dòng)態(tài)級(jí)聯(lián)加載的示例代碼，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-11-11
這篇文章主要介紹了jquery插件開發(fā)模式,結(jié)合實(shí)例形式詳細(xì)分析了jQuery插件三種開發(fā)方式實(shí)現(xiàn)方法與相關(guān)操作技巧,需要的朋友可以參考下2019-07-07
jQuery插件FusionCharts實(shí)現(xiàn)的MSBar3D圖效果示例【附demo源碼】
這篇文章主要介紹了jQuery插件FusionCharts實(shí)現(xiàn)的MSBar3D圖效果,結(jié)合完整實(shí)例形式分析了jQuery使用FusionCharts載入xml數(shù)據(jù)繪制MSBar3D圖的相關(guān)操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
基于jQuery和hwSlider實(shí)現(xiàn)內(nèi)容左右滑動(dòng)切換效果附源碼下載（一）
本文結(jié)合實(shí)例給大家介紹如何實(shí)現(xiàn)內(nèi)容滑動(dòng)切換的效果，包括左右箭頭切換，無限無縫滾動(dòng)，圓點(diǎn)按鈕切換，動(dòng)畫效果，自動(dòng)切換效果，效果非常不錯(cuò)，感興趣的朋友前來參考實(shí)現(xiàn)代碼2016-06-06
jQuery實(shí)現(xiàn)的一個(gè)tab切換效果內(nèi)部還嵌有切換
這篇文章主要介紹了jQuery實(shí)現(xiàn)的一個(gè)tab切換效果，它的特色是內(nèi)部還嵌有切換,需要的朋友可以參考下2014-08-08
本篇文章主要是對(duì)判斷jQuery當(dāng)前元素是隱藏還是顯示的示例代碼進(jìn)行了介紹，需要的朋友可以過來參考下2016-11-11
jquery插件jquery.beforeafter.js實(shí)現(xiàn)左右拖拽分隔條對(duì)比圖片的方法
這篇文章主要介紹了jquery插件jquery.beforeafter.js實(shí)現(xiàn)左右拖拽分隔條對(duì)比圖片的方法,可實(shí)現(xiàn)圖片拖拽變換的功能,需要的朋友可以參考下2015-08-08
本文主要介紹了jquery的代碼規(guī)范。具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-02-02