JavaScript：只能输入数字(IE、FF)

2009-12-03  来自：博客园  字体大小：【 大  中  小】

• 摘要：为了解决只能输入数字的问题，网上有许多资料，现归拢一下。

为了解决只能输入数字的问题，网上有许多资料，现归拢一下。

　　一、不带负号的输入

这里，没有解决“正负号”的问题。

由于“正负号”必须出现在数字的最前端，因此，必须要判断当前光标所在的位置是否在输入文本框的首位。

 

<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; 
}