admin管理员组

文章数量:1134601

I have a text field that allows a user to enter their age. I am trying to do some client-side validation on this field with JavaScript. I have server-side validation already in place. However, I cannot seem to verify that the user enters an actual integer. I am currently trying the following code:

    function IsValidAge(value) {
        if (value.length == 0) {
            return false;
        }

        var intValue = parseInt(value);
        if (intValue == Number.NaN) {
            return false;
        }

        if (intValue <= 0)
        {
            return false;
        }
        return true;
    }

The odd thing is, I have entered individual characters into the textbox like "b" and this method returns true. How do I ensure that the user is only entering an integer?

Thank you

I have a text field that allows a user to enter their age. I am trying to do some client-side validation on this field with JavaScript. I have server-side validation already in place. However, I cannot seem to verify that the user enters an actual integer. I am currently trying the following code:

    function IsValidAge(value) {
        if (value.length == 0) {
            return false;
        }

        var intValue = parseInt(value);
        if (intValue == Number.NaN) {
            return false;
        }

        if (intValue <= 0)
        {
            return false;
        }
        return true;
    }

The odd thing is, I have entered individual characters into the textbox like "b" and this method returns true. How do I ensure that the user is only entering an integer?

Thank you

Share Improve this question asked Jun 19, 2009 at 18:50 user70192user70192 14.2k53 gold badges166 silver badges243 bronze badges 4
  • 4 Just a related note, you should always call parseInt() with two parameters - the value and the radix (base). Otherwise parseInt() will attempt to guess the base of your input. – waxwing Commented Jun 19, 2009 at 18:57
  • 1 If the user enters "1.1", do you want the to fail validation, or be forced to "1"? – Nosredna Commented Jun 19, 2009 at 19:02
  • 1 And for that matter, is "1.0" an integer? – Nosredna Commented Jun 19, 2009 at 19:12
  • MDN mentions: Use Number.isNaN() or isNaN() to most clearly determine whether a value is NaN. – Torsten Römer Commented Mar 18, 2015 at 12:26
Add a comment  | 

12 Answers 12

Reset to default 132
var intRegex = /^\d+$/;
if(intRegex.test(someNumber)) {
   alert('I am an int');
   ...
}

That will absolutely, positively fail if the user enters anything other than an nonnegative integer.

For real int checking, use this:

function isInt(value) { 
    return !isNaN(parseInt(value,10)) && (parseFloat(value,10) == parseInt(value,10)); 
}

The problem with many int checks is that they return 'false' for 1.0, which is a valid integer. This method checks to make sure that the value of float and int parsing are equal, so for #.00 it will return true.

UPDATE:

Two issues have been discussed in the comments I'll add to the answer for future readers:

  • First, when parsing string values that use a comma to indicate the decimal place, this method doesn't work. (Not surprising, how could it? Given "1,001" for example in the US it's an integer while in Germany it isn't.)
  • Second, the behavior of parseFloat and parseInt has changed in certain browsers since this answer was written and vary by browser. ParseInt is more aggressive and will discard letters appearing in a string. This is great for getting a number but not so good for validation.

My recommendation and practice to use a library like Globalize.js to parse numeric values for/from the UI rather than the browser implementation and to use the native calls only for known "programmatically" provided values, such as a string parsed from an XML document.

use isNaN(n)

i.e.

if(isNaN(intValue))

in place of

if (intValue == Number.NaN)

UPDATE

I have fixed the code that had an error and added a var called key to store the key pressed code using keyCode and which, that depend of the browser.

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

Thanks Donald.McLean :)


If you want to check if you are writing numbers while typing (and avoid writing other characters into your input field), you can use this simple function and you can define the elements allowed (this include whatever you want to filter). In this way you can choose not only integers but for example a certain group of characters. The example is based in jQuery to attach it to an input field.

$('#myInputField').keypress(function(e)
{
    var key = e.which || e.keyCode;

    if (!(key >= 48 && key <= 57) && // Interval of values (0-9)
         (key !== 8) &&              // Backspace
         (key !== 9) &&              // Horizontal tab
         (key !== 37) &&             // Percentage
         (key !== 39) &&             // Single quotes (')
         (key !== 46))               // Dot
    {
        e.preventDefault();
        return false;
    }
});

If you use other key than the defined, it won't appear into the field. And because Angular.js is getting strong these days. this is the directive you can create to do this in any field in your web app:

myApp.directive('integer', function()
{
    return function (scope, element, attrs)
    {
        element.bind('keydown', function(e)
        {
            var key = e.which || e.keyCode;

            if (!(key >= 48 && key <= 57) && // Interval (0-9)
                 (key !== 8) &&              // Backspace
                 (key !== 9) &&              // Horizontal tab
                 (key !== 37) &&             // Percentage
                 (key !== 39) &&             // Single quotes (')
                 (key !== 46))               // Dot
            {
                e.preventDefault();
                return false;
            }
        });
    }
});

But what happens if you want to use ng-repeat and you need to apply this directive only in a certain number of fields. Well, you can transform the upper directive into one prepared to admit a true or false value in order to be able to decide which field will be affected by it.

myApp.directive('rsInteger', function() {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            if (attrs.rsInteger === 'true') {
                element.bind('keydown', function(e)
                {
                    var key = e.which || e.keyCode;

                    if (!(key >= 48 && key <= 57) && // Interval (0-9)
                         (key !== 8) &&              // Backspace
                         (key !== 9) &&              // Horizontal tab
                         (key !== 37) &&             // Percentage
                         (key !== 39) &&             // Single quotes (')
                         (key !== 46))               // Dot
                    {
                        e.preventDefault();
                        return false;
                    }
                });
            }
        }
    }
});

To use this new directive you just need to do it in a input type text like this, for example:

<input type="text" rs-integer="true">

Hope it helps you.

I did this to check for number and integer value

if(isNaN(field_value * 1) || (field_value % 1) != 0 ) not integer;
else integer;

Modular Divison

Example
1. 25.5 % 1 != 0 and ,
2. 25 % 1 == 0

And if(field_value * 1) NaN if string eg: 25,34 or abcd etc ... else integer or number

function isInt(x) {return Math.floor(x) === x;}

If your number is in the 32bit integer range, you could go with something like:

function isInt(x) { return ""+(x|0)==""+x; }

The bitwise or operator forces conversion to signed 32bit int. The string conversion on both sides ensures that true/false want be matched.

I found the NaN responses lacking because they don't pick up on trailing characters (so "123abc" is considered a valid number) so I tried converting the string to an integer and back to a string, and ensuring it matched the original after conversion:

if ("" + parseInt(stringVal, 10) == stringVal) { alert("is valid number"); }

This worked for me, up until the numbers were so large they started appearing as scientific notation during the conversion.

...so of course this means you could enter a number in scientific notation, but checking minimum and maximum values as well would prevent that if you so desire.

It will of course fail if you use separators (like "1,000" or "1.000" depending on your locale) - digits only allowed here.

Nobody tried this simple thing?

function isInt(value) {
    return value == parseInt(value, 10);
}

What's wrong with that?

You may use isInteger() method of Number object

if ( (new Number(x)).isInteger() ) {
  // handle integer
}

This method works properly if x is undefined or null. But it has poor browser support for now

As the other answers show, there are lots of different ways to test if a string counts as an integer. Assuming you don't need to worry about scientific notation or locale-specific formatting (e.g. the commas in "1,000,000")* your best bet is probably a regular expression. Perhaps something like:

/^[-+]?\d+$/

Another possible method using Number.isInteger:

Number.isInteger(Number(x))

Or, if you're a bit naughty, you can use BigInt as a parsing function:

try { BigInt(x); return true; } catch { return false; }

(Bear in mind that the previous two tests will pass on the empty string, as well as strings that contain only whitespace, so you may want to test for that first.)

However, your question specifically asks about validating a user's age, so you probably want a stricter test than just "is it an integer?" You could modify our earlier regular expression to disallow negative numbers and leading zeroes:

/^\+?[1-9]\d*$/

but this would still give a pass to values like "999", which--unless some of your users are vampires--is probably not what you want.

To my mind, the simplest and clearest solution would be something like this:

function isValidAge(x) {
  let parsed = Number(x)
  return Number.isInteger(parsed) && parsed > 0 && parsed < 150
}

*If you do need to worry about scientific notation or locale-specific formatting, you should probably just use a library function.

If (enteredAge < "1" || enteredAge > "130") ......

Simple and it works....until they develop immortality

本文标签: JavaScriptTest for an integerStack Overflow