生活随笔
收集整理的這篇文章主要介紹了
[转]JavaScript：只能输入数字(IE、FF)
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
本文轉(zhuǎn)自：http://www.cnblogs.com/ly5201314/archive/2009/03/04/1402993.html
JavaScript：只能輸入數(shù)字(IE、FF)
為了解決只能輸入數(shù)字的問題，網(wǎng)上有許多資料，現(xiàn)歸攏一下。
一、不帶負(fù)號(hào)的輸入
這里，沒有解決“正負(fù)號(hào)”的問題。
由于“正負(fù)號(hào)”必須出現(xiàn)在數(shù)字的最前端，因此，必須要判斷當(dāng)前光標(biāo)所在的位置是否在輸入文本框的首位。
?
| <script language="JavaScript" type="text/javascript" >
<!--
//調(diào)用方式：onkeydown = "DigitInput(this,event);"
function DigitInput(el,ev) {
//8：退格鍵、46：delete、37-40： 方向鍵
//48-57：小鍵盤區(qū)的數(shù)字、96-105：主鍵盤區(qū)的數(shù)字
//110、190：小鍵盤區(qū)和主鍵盤區(qū)的小數(shù)
//189、109：小鍵盤區(qū)和主鍵盤區(qū)的負(fù)號(hào) ??? var event = ev || window.event;???????????????????????????? //IE、FF下獲取事件對(duì)象
??? var currentKey = event.charCode||event.keyCode;???????????? //IE、FF下獲取鍵盤碼
???
??? //小數(shù)點(diǎn)處理
??? 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>? |
?
二、帶負(fù)號(hào)的輸入
判斷帶負(fù)號(hào)的輸入，則必須要知道光標(biāo)的位置，也就是說，只有當(dāng)光標(biāo)在最前端時(shí)，負(fù)號(hào)才有效。
?
| <script language="JavaScript" type="text/javascript" >
<!--
//調(diào)用方式：onkeydown = "DigitInput(this,event);"
function DigitInput(el,ev) {
//8：退格鍵、46：delete、37-40： 方向鍵
//48-57：小鍵盤區(qū)的數(shù)字、96-105：主鍵盤區(qū)的數(shù)字
//110、190：小鍵盤區(qū)和主鍵盤區(qū)的小數(shù)
//189、109：小鍵盤區(qū)和主鍵盤區(qū)的負(fù)號(hào) ??? var event = ev || window.event;???????????????????????????? //IE、FF下獲取事件對(duì)象
??? var currentKey = event.charCode||event.keyCode;???????????? //IE、FF下獲取鍵盤碼
???
??? //小數(shù)點(diǎn)處理
??? 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
??????? //負(fù)號(hào)處理
??????? 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(); }
/**
? * 獲取光標(biāo)所在的字符位置
? * @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)函數(shù)，是一個(gè)獲取光標(biāo)位置的通用函數(shù)。
為了減少傳入的參數(shù)，事件對(duì)象是可以通過事件獲取的：
?
| ?var el = window.event.srcElement||ev.target; |
?只需將傳DigitInput(el,ev)的第一句加上上面這條語句，并且將傳入?yún)?shù)只有ev一個(gè)即可，這樣，減少了傳入值。
三、擴(kuò)展
我們可以增加一個(gè)傳入的參數(shù)值，用于限定允許輸入的數(shù)字條件：
1：允許正整數(shù)；2、允許正小數(shù)；3、允許負(fù)整數(shù)；4、允許負(fù)小數(shù)。
當(dāng)然，傳入一個(gè)正則表達(dá)式也可以實(shí)現(xiàn)。
?
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
???????)
????)?
//考慮小鍵盤上的數(shù)字鍵?
????event.returnValue=false;?
}
?
創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)
總結(jié)
以上是生活随笔為你收集整理的[转]JavaScript：只能输入数字(IE、FF)的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。
