輸入框過濾非數(shù)字的js代碼
更新時間:2014年09月18日 17:21:12 投稿:whsnow
這篇文章主要介紹js過濾輸入框中非數(shù)字的字符,很簡單,但很實用,需要的朋友可以參考下
HTML:
復(fù)制代碼 代碼如下:
<input type="text" id="only"/>
JS:
window.onload=function(e){ var text=document.getElementById("only"),pattern=/\d/,//pattern匹配字母上的數(shù)字鍵 pattern2=/(9[6-9])|(10[0-5])|3(7|9)/,//pattern2匹配小鍵盤上的數(shù)字鍵和左右方向鍵 EventHandle={},event=e||window.event;//一個處理事件的對象 //當(dāng)網(wǎng)頁加載的時候,進行判斷,對事件處理對象進行定義屬性,這樣對事件對象的方法只需要進行一次判斷,以后的其他事件 //處理程序里面不需要判斷 if(event.preventDefault){ EventHandle.preventDefault=function(e){ e.preventDefault(); }; }else{ EventHandle.preventDefault=function(e){ e.returnValue=false; } } text.onkeydown=function(e){ var event=e||window.event;//不同事件的事件對象不一樣,這個event和最前面的event不相等 if(!pattern.test(String.fromCharCode(event.keyCode))&&event.keyCode!=8//keyCode=8是退格鍵,因為可以對輸入的數(shù)字進行修改,所以退格和左右方向鍵不禁止 &&!pattern2.test(event.keyCode.toString())||event.shiftKey|| event.ctrlKey||event.metaKey){ EventHandle.preventDefault(event);//如果不用對象的這個方法,寫成下面這樣,也可以執(zhí)行,不過每次按下鍵盤的時候都會進行一次判斷 //這個是沒有必要的,所以在頁面加載的時候?qū)κ录幚韺ο蠖x一個方法,加載后對象的方法就已經(jīng)是確定的了,以后時候就可以了 //if(event.preventDefault){ //event.preventDefault(); //}else{ //event.returnValue=false; //} } } }
未注釋版本:
window.onload=function(e){ var text=document.getElementById("only"),pattern=/\d/, pattern2=/(9[6-9])|(10[0-5])|3(7|9)/, EventHandle={},event=e||window.event; if(event.preventDefault){ EventHandle.preventDefault=function(e){ e.preventDefault(); }; }else{ EventHandle.preventDefault=function(e){ e.returnValue=false; } } text.onkeydown=function(e){ var event=e||window.event; if(!pattern.test(String.fromCharCode(event.keyCode))&&event.keyCode!=8 &&!pattern2.test(event.keyCode.toString())||event.shiftKey|| event.ctrlKey||event.metaKey){ EventHandle.preventDefault(event); } } }
在IE11里面,F(xiàn)12打開開發(fā)者工具里面可以選擇IE版本進行調(diào)試
相關(guān)文章
js實現(xiàn)同一頁面可多次調(diào)用的圖片幻燈切換效果
這篇文章主要介紹了js實現(xiàn)同一頁面可多次調(diào)用的圖片幻燈切換效果,可實現(xiàn)在同一頁面中多次調(diào)用幻燈切換效果,非常具有實用價值,需要的朋友可以參考下2015-02-02ie支持function.bind()方法實現(xiàn)代碼
在 google 一番技術(shù)資料后,發(fā)現(xiàn) firefox 原生支持一個 bind 方法,該方法很好的滿足了我們的初衷,調(diào)用方法與 call 和 apply 一樣,只是定義完成后,在后期調(diào)用時該方法才會執(zhí)行,需要的朋友可以了解下2012-12-12javascript showModalDialog傳值與FireFox的window.open 父子窗口傳值示例
javascript showModalDialog傳值與FireFox的window.open 父子窗口傳值示例代碼。2009-11-11JavaScript實現(xiàn)枚舉的幾種方法總結(jié)
在前端開發(fā)中,我們可能經(jīng)常需要用到枚舉,使用枚舉的好處是為了讓代碼的可讀性更強,避免直接使用數(shù)字或未知的字符串,但是在JavaScript中,要自己實現(xiàn)一個枚舉功能,那么大家能想到多少種實現(xiàn)枚舉的方法呢,我將介紹幾種實現(xiàn)枚舉的好方法2023-08-08