仅允许脚本中的数字和点

时间：2012-03-21 06:16:37

标签： javascript asp.net regex validation

使用此javascript限制用户只键入数字，只有一个点作为小数点分隔符。

<script type="text/javascript">
 function fun_AllowOnlyAmountAndDot(txt)
        {
            if(event.keyCode > 47 && event.keyCode < 58 || event.keyCode == 46)
            {
               var txtbx=document.getElementById(txt);
               var amount = document.getElementById(txt).value;
               var present=0;
               var count=0;

               if(amount.indexOf(".",present)||amount.indexOf(".",present+1));
               {
              // alert('0');
               }

              /*if(amount.length==2)
              {
                if(event.keyCode != 46)
                return false;
              }*/
               do
               {
               present=amount.indexOf(".",present);
               if(present!=-1)
                {
                 count++;
                 present++;
                 }
               }
               while(present!=-1);
               if(present==-1 && amount.length==0 && event.keyCode == 46)
               {
                    event.keyCode=0;
                    //alert("Wrong position of decimal point not  allowed !!");
                    return false;
               }

               if(count>=1 && event.keyCode == 46)
               {

                    event.keyCode=0;
                    //alert("Only one decimal point is allowed !!");
                    return false;
               }
               if(count==1)
               {
                var lastdigits=amount.substring(amount.indexOf(".")+1,amount.length);
                if(lastdigits.length>=2)
                            {
                              //alert("Two decimal places only allowed");
                              event.keyCode=0;
                              return false;
                              }
               }
                    return true;
            }
            else
            {
                    event.keyCode=0;
                    //alert("Only Numbers with dot allowed !!");
                    return false;
            }

        }

    </script>

<td align="right">
<asp:TextBox ID="txtQ1gTarget" runat="server" Width="30px" CssClass="txtbx" MaxLength="6" onkeypress="return fun_AllowOnlyAmountAndDot(this);"></asp:TextBox>
</td>

但是onkeypress（this）事件在该地方返回该函数中的对象所需错误

var amount = document.getElementById(txt).value;

我的错误是什么？

16 个答案:

答案 0 :(得分：36)

这是使用正则表达式的好地方。

通过使用正则表达式，您可以只用一行替换所有代码。

您可以使用以下 regex 来验证您的要求：

[0-9]*\.?[0-9]*

换句话说：零个或多个数字字符，后跟零个或一个句点，后跟零个或多个数字字符。

您可以使用以下代码替换代码：

function validate(s) {
    var rgx = /^[0-9]*\.?[0-9]*$/;
    return s.match(rgx);
}

该代码可以取代您的整个功能！

请注意，您必须使用反斜杠转义句点（否则它代表“任何字符”）。

有关使用javascript使用正则表达式的更多信息，请查看：

您还可以在此处测试上述正则表达式：

上面使用的正则表达式的说明：

  • 括号表示“这些括号内的任何字符。”您可以使用连字符（如上所示）来指示一系列字符。

  • *表示“前一个表达式的零个或多个。”

  • [0-9]*表示“零个或多个数字”

  • 反斜杠用作句点的转义字符，因为句点通常代表“任何字符”。

  • ?表示“零或一个前一个字符。”

  • ^代表字符串的开头。

  • $代表字符串的结尾。

  • 使用^启动正则表达式并以$结尾，可确保整个字符串符合正则表达式模式。

希望这有帮助！

答案 1 :(得分：15)

使用Jquery代替。在文本框中添加一个十进制类：

<input type="text" class="decimal" value="" />

在JS中使用此代码。它会检查多个小数，并限制用户只键入数字。

$('.decimal').keyup(function(){
    var val = $(this).val();
    if(isNaN(val)){
         val = val.replace(/[^0-9\.]/g,'');
         if(val.split('.').length>2) 
             val =val.replace(/\.+$/,"");
    }
    $(this).val(val); 
});​

检查这个小提琴：http://jsfiddle.net/2YW8g/

希望它有所帮助。

答案 2 :(得分：9)

而不是使用它：

onkeypress="return fun_AllowOnlyAmountAndDot(this);"

你应该用这个：

onkeypress="return fun_AllowOnlyAmountAndDot(this.id);"

答案 3 :(得分：6)

function isNumberKey(evt,id)
{
	try{
        var charCode = (evt.which) ? evt.which : event.keyCode;
  
        if(charCode==46){
            var txt=document.getElementById(id).value;
            if(!(txt.indexOf(".") > -1)){
	
                return true;
            }
        }
        if (charCode > 31 && (charCode < 48 || charCode > 57) )
            return false;

        return true;
	}catch(w){
		alert(w);
	}
}
<html>
  <head>
  </head>
  <body>
    <INPUT id="txtChar" onkeypress="return isNumberKey(event,this.id)" type="text" name="txtChar">
  </body>
</html>

答案 4 :(得分：5)

只需在输入文字中添加以下代码：

onkeypress='return event.charCode == 46 || (event.charCode >= 48 && event.charCode <= 57)'

答案 5 :(得分：3)

<input type="text" class="decimal" value="" />
$('.decimal').keypress(function(evt){
    return (/^[0-9]*\.?[0-9]*$/).test($(this).val()+evt.key);
});

我认为这个简单的解决方案可能是。

答案 6 :(得分：2)

这对我最有效。

我还在模糊处应用货币格式化，其中小数部分以2位数舍入，以防万一用parseFloat验证。

获取和设置光标位置的功能来自Vishal Monpara的博客。我也在使用这些功能做一些很好的事情。如果需要，您可以轻松删除2个代码块，其中强制使用2个小数，并删除set / get插入符函数。

<html>
<body>
<input type="text" size="30" maxlength="30" onkeypress="return numericValidation(this,event);" />
<script language="JavaScript">
    function numericValidation(obj,evt) {
        var e = event || evt; // for trans-browser compatibility

        var charCode = e.which || e.keyCode;        

        if (charCode == 46) { //one dot
            if (obj.value.indexOf(".") > -1)
                return false;
            else {
                //---if the dot is positioned in the middle give the user a surprise, remember: just 2 decimals allowed
                var idx = doGetCaretPosition(obj);
                var part1 = obj.value.substr(0,idx),
                    part2 = obj.value.substring(idx);

                if (part2.length > 2) {
                    obj.value = part1 + "." + part2.substr(0,2);
                    setCaretPosition(obj, idx + 1);
                    return false;
                }//---

                //allow one dot if not cheating
                return true;
            }
        }
        else if (charCode > 31 && (charCode < 48 || charCode > 57)) { //just numbers
            return false;
        }

        //---just 2 decimals stubborn!
        var arr = obj.value.split(".") , pos = doGetCaretPosition(obj);

        if (arr.length == 2 && pos > arr[0].length && arr[1].length == 2)                               
            return false;
        //---

        //ok it's a number
        return true;
    }

    function doGetCaretPosition (ctrl) {
        var CaretPos = 0;   // IE Support
        if (document.selection) {
        ctrl.focus ();
            var Sel = document.selection.createRange ();
            Sel.moveStart ('character', -ctrl.value.length);
            CaretPos = Sel.text.length;
        }
        // Firefox support
        else if (ctrl.selectionStart || ctrl.selectionStart == '0')
            CaretPos = ctrl.selectionStart;
        return (CaretPos);
    }

    function setCaretPosition(ctrl, pos){
        if(ctrl.setSelectionRange)
        {
            ctrl.focus();
            ctrl.setSelectionRange(pos,pos);
        }
        else if (ctrl.createTextRange) {
            var range = ctrl.createTextRange();
            range.collapse(true);
            range.moveEnd('character', pos);
            range.moveStart('character', pos);
            range.select();
        }
    }
</script>
</body>
</html>

答案 7 :(得分：1)

<script type="text/javascript">
    function numericValidation(txtvalue) {
        var e = event || evt; // for trans-browser compatibility
        var charCode = e.which || e.keyCode;
        if (!(document.getElementById(txtvalue.id).value))
         {
            if (charCode > 31 && (charCode < 48 || charCode > 57))
                return false;
            return true;
        }
        else {
               var val = document.getElementById(txtvalue.id).value;
            if(charCode==46 || (charCode > 31 && (charCode > 47 && charCode < 58)) )
             {
                var points = 0;            
                points = val.indexOf(".", points);                    
                if (points >= 1 && charCode == 46)
                {      
                   return false;
                }                 
                if (points == 1) 
                {
                    var lastdigits = val.substring(val.indexOf(".") + 1, val.length);
                    if (lastdigits.length >= 2)
                    {
                        alert("Two decimal places only allowed");
                        return false;
                    }
                }
                return true;
            }
            else {
                alert("Only Numarics allowed");
                return false;
            }
        }
    }

</script>
<form id="form1" runat="server">
<div>
  <asp:TextBox ID="txtHDLLevel" MaxLength="6" runat="server" Width="33px" onkeypress="return numericValidation(this);"  />
</div>
</form>

答案 8 :(得分：1)

function isNumber(evt) {
    evt = (evt) ? evt : window.event;
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 46 || charCode > 57)) {
        return false;
    }
    return true;
}

你应该使用这个函数并写下这个元素的属性;

HTML代码： 

<input id="deneme" data-mini="true" onKeyPress="return isNumber(event)" type="text"/>`

答案 9 :(得分：1)

尝试此代码

var check = function(evt){

var data = document.getElementById('num').value;
if((evt.charCode>= 48 && evt.charCode <= 57) || evt.charCode== 46 ||evt.charCode == 0){
if(data.indexOf('.') > -1){
 if(evt.charCode== 46)
  evt.preventDefault();
}
}else
evt.preventDefault();
};

document.getElementById('num').addEventListener('keypress',check);
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<input type="text" id="num" value="" />



</body>
</html>

答案 10 :(得分：1)

尝试使用多个文本文件（使用类选择器）：

Click here for example..

＆＃13;
＆＃13; 
var checking = function(event){
	var data = this.value;
	if((event.charCode>= 48 && event.charCode <= 57) || event.charCode== 46 ||event.charCode == 0){
		if(data.indexOf('.') > -1){
 			if(event.charCode== 46)
  				event.preventDefault();
		}
	}else
		event.preventDefault();
	};

	function addListener(list){
		for(var i=0;i<list.length;i++){
    		list[i].addEventListener('keypress',checking);
    	}
	}
	var classList = document.getElementsByClassName('number');
	addListener(classList);
＆＃13; 
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
  <input type="text" class="number" value="" /><br><br>
  <input type="text" class="number" value="" /><br><br>
  <input type="text" class="number" value="" /><br><br>
  <input type="text" class="number" value="" /><br><br>
</body>
</html>
＆＃13;
＆＃13;
＆＃13;

答案 11 :(得分：0)

此功能将阻止输入除数字和单个点以外的任何内容。

#include <stdio.h>
#include <stdlib.h>

int main()
{
    char name[256];
    char *sep[100];
    for( int n = 0 ; n < 100 ; n++ )
    {
        sep[n] = malloc(30*sizeof(char));
    }
    int i = 0, j = 0, k = 0;
    scanf(" %255[^\n]s", name);

    for(i = 0; name[i] != '\0'; i++)
    {
        if( name[i] == '\\')
        {
            sep[k][j] = '\0';
            j = 0;
            k++;
        }
        else
        {
            sep[k][j] = name[i];
            j++;
        }
    }

    sep[k][j] = '\0';
    for(i = 0; i <= k ; i++)
    {
        printf("%s\n",sep[i]);
    }
    for( int n = 0 ; n < 100 ; n++ )
    {
        free(sep[n]);
    }
    return 0;
}

function validateQty(el, evt) {
   var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode != 45 && charCode != 8 && (charCode != 46) && (charCode < 48 || charCode > 57))
        return false;
    if (charCode == 46) {
        if ((el.value) && (el.value.indexOf('.') >= 0))
            return false;
        else
            return true;
    }
    return true;
    var charCode = (evt.which) ? evt.which : event.keyCode;
    var number = evt.value.split('.');
    if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
        return false;
    }
};

答案 12 :(得分：0)

您可以使用此

JavaScript 

function isNumber(evt) {
    evt = (evt) ? evt : window.event;
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 48 || charCode > 57)&&(charCode!=46)) {
        return false;
    }
    return true;
}

用法 

 <input onkeypress="return isNumber(event)" class="form-control">

答案 13 :(得分：0)

 <script type="text/Javascript">
        function checkDecimal(inputVal) {
            var ex = /^[0-9]+\.?[0-9]*$/;
            if (ex.test(inputVal.value) == false) {
                inputVal.value = inputVal.value.substring(0, inputVal.value.length - 1);
            }
        }
</script>

答案 14 :(得分：-1)

 <input type="text" class="form-control" id="odometer_reading" name="odometer_reading"  placeholder="Odometer Reading" onblur="odometer_reading1();" onkeypress='validate(event)' required="" />
<script>
                function validate(evt) {
                  var theEvent = evt || window.event;
                  var key = theEvent.keyCode || theEvent.which;
                  key = String.fromCharCode( key );
                  var regex = /[0-9]|\./;
                  if( !regex.test(key) ) {
                    theEvent.returnValue = false;
                    if(theEvent.preventDefault) theEvent.preventDefault();
                  }
                }
            </script>

答案 15 :(得分：-2)

希望这可以帮助某人

$(document).on("input", ".numeric", function() {
this.value = this.value.match(/^\d+\.?\d{0,2}/);});
相关问题
最新问题