生活随笔
收集整理的這篇文章主要介紹了
[转]JavaScript：只能输入数字(IE、FF)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
本文轉自：http://www.cnblogs.com/ly5201314/archive/2009/03/04/1402993.html
JavaScript：只能輸入數字(IE、FF)
為了解決只能輸入數字的問題，網上有許多資料，現歸攏一下。
一、不帶負號的輸入
這里，沒有解決“正負號”的問題。
由于“正負號”必須出現在數字的最前端，因此，必須要判斷當前光標所在的位置是否在輸入文本框的首位。
?
| <script language="JavaScript" type="text/javascript" >
<!--
//調用方式：onkeydown = "DigitInput(this,event);"
function DigitInput(el,ev) {
//8：退格鍵、46：delete、37-40： 方向鍵
//48-57：小鍵盤區的數字、96-105：主鍵盤區的數字
//110、190：小鍵盤區和主鍵盤區的小數
//189、109：小鍵盤區和主鍵盤區的負號 ??? var event = ev || window.event;???????????????????????????? //IE、FF下獲取事件對象
??? var currentKey = event.charCode||event.keyCode;???????????? //IE、FF下獲取鍵盤碼
???
??? //小數點處理
??? if (currentKey == 110 || currentKey == 190) {
??????? if (el.value.indexOf(".")>=0)
??????????? if (window.event)?????????????????????? //IE
??????????????? event.returnValue=false;???????????????? //e.returnValue = false;效果相同.
??????????? else??????????????????????????????????? //Firefox
??????????????? event.preventDefault(); ??? } else
??????? if (currentKey!=8 && currentKey != 46 && (currentKey<37 || currentKey>40) && (currentKey<48 || currentKey>57) && (currentKey<96 || currentKey>105))
??????????? if (window.event)?????????????????????? //IE
??????????????? event.returnValue=false;???????????????? //e.returnValue = false;效果相同.
??????????? else??????????????????????????????????? //Firefox
??????????????? event.preventDefault(); }
--> </script>? |
?
二、帶負號的輸入
判斷帶負號的輸入，則必須要知道光標的位置，也就是說，只有當光標在最前端時，負號才有效。
?
| <script language="JavaScript" type="text/javascript" >
<!--
//調用方式：onkeydown = "DigitInput(this,event);"
function DigitInput(el,ev) {
//8：退格鍵、46：delete、37-40： 方向鍵
//48-57：小鍵盤區的數字、96-105：主鍵盤區的數字
//110、190：小鍵盤區和主鍵盤區的小數
//189、109：小鍵盤區和主鍵盤區的負號 ??? var event = ev || window.event;???????????????????????????? //IE、FF下獲取事件對象
??? var currentKey = event.charCode||event.keyCode;???????????? //IE、FF下獲取鍵盤碼
???
??? //小數點處理
??? if (currentKey == 110 || currentKey == 190) {
??????? if (el.value.indexOf(".")>=0)
??????????? if (window.event)?????????????????????? //IE
??????????????? event.returnValue=false;???????????????? //e.returnValue = false;效果相同.
??????????? else??????????????????????????????????? //Firefox
??????????????? event.preventDefault(); ??? } else
??????? //負號處理
??????? if (currentKey == 189 || currentKey == 109) {
??????????? if (getPosition(el)>0 || el.value.indexOf("-")>=0)
??????????????? if (window.event)?????????????????????? //IE
??????????????????? event.returnValue=false;???????????????? //e.returnValue = false;效果相同.
??????????????? else??????????????????????????????????? //Firefox
??????????????????? event.preventDefault();
??????? } else
??????? if (currentKey!=8 && currentKey != 46 && (currentKey<37 || currentKey>40) && (currentKey<48 || currentKey>57) && (currentKey<96 || currentKey>105))
??????????? if (window.event)?????????????????????? //IE
??????????????? event.returnValue=false;???????????????? //e.returnValue = false;效果相同.
??????????? else??????????????????????????????????? //Firefox
??????????????? event.preventDefault(); }
/**
? * 獲取光標所在的字符位置
? * @param obj 要處理的控件, 支持文本域和輸入框
? * @author hotleave
? */
function getPosition(obj){
??? var result = 0;
??? if(obj.selectionStart){ //非IE瀏覽器
??????? result = obj.selectionStart
??? }else{????????????????? //IE
??????? var rng;
??????? if(obj.tagName == "TEXTAREA"){ //如果是文本域
??????????? rng = event.srcElement.createTextRange();
??????????? rng.moveToPoint(event.x,event.y);
??????? }else{???????????????????????? //輸入框
??????????? rng = document.selection.createRange();
??????? }
??????? rng.moveStart("character",-event.srcElement.value.length);
??????? result = rng.text.length;
??? }
??? return result;
} --> </script>? |
getPosition(obj)函數，是一個獲取光標位置的通用函數。
為了減少傳入的參數，事件對象是可以通過事件獲取的：
?
| ?var el = window.event.srcElement||ev.target; |
?只需將傳DigitInput(el,ev)的第一句加上上面這條語句，并且將傳入參數只有ev一個即可，這樣，減少了傳入值。
三、擴展
我們可以增加一個傳入的參數值，用于限定允許輸入的數字條件：
1：允許正整數；2、允許正小數；3、允許負整數；4、允許負小數。
當然，傳入一個正則表達式也可以實現。
?
function?onlyNum()?
{?
??if(!(?(event.keyCode?>=?48?&&?event.keyCode<=57?)
????????||(?event.keyCode?>=?96?&&?event.keyCode?<=?105?)
????????||?(?event.keyCode?==?8?)???//退格
????????||?(?event.keyCode?==?46?)?//Del
????????||?(?event.keyCode?==?27?)?//ESC
????????||?(?event.keyCode?==?37?)?//左
????????||?(?event.keyCode?==?39?)?//右
????????||?(?event.keyCode?==?16?)?//shift
????????||?(?event.keyCode?==?9?)?//Tab
???????)
????)?
//考慮小鍵盤上的數字鍵?
????event.returnValue=false;?
}
?
創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎
總結
以上是生活随笔為你收集整理的[转]JavaScript：只能输入数字(IE、FF)的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
