JavaScript - 整数のテスト

質問

ユーザーが自分の年齢を入力するためのテキストフィールドがあります。私はJavaScriptでこのフィールドにいくつかのクライアント側の検証を行おうとしています。サーバーサイドの検証はすでに行っています。しかし、ユーザーが実際の整数を入力したかどうかを確認することができないようです。現在、以下のコードを試しています。

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

奇妙なことに、私はテキストボックスに"b"のような個々の文字を入力し、このメソッドはtrueを返します。ユーザーが整数だけを入力していることを確認するにはどうすればよいでしょうか。

ありがとうございます。

どのように解決するのですか？

アップデイト

エラーの出ていたコードを修正し、Varに キー を使って押されたキーのコードを保存するようにしました。 キーコード と どの は、ブラウザに依存します。

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

Donald.McLean ありがとうございます :)

入力中に数字を書いているかどうかをチェックしたい場合（そして入力フィールドに他の文字を書くのを避けたい場合）、このシンプルな関数を使用することができ、許可する要素（これはフィルタリングしたいものを含みます）を定義することができます。この方法では、整数だけでなく、例えば特定の文字群を選択することができる。この例は、jQueryを使用して入力フィールドに取り付けています。

$('#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;
    }
});

定義されたキー以外を使用すると、フィールドに表示されません。また、最近はAngular.jsが強くなってきているので、Webアプリの任意のフィールドにこれを行うためのディレクティブを作成することができます。

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

しかし、もし ng-repeat を使い、このディレクティブをあるフィールドの数だけ適用する必要がある場合はどうなりますか？さて、あなたは上のディレクティブを 真 または false の値で、どのフィールドが影響を受けるかを決定できるようにします。

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

この新しいディレクティブを使うには、例えば次のような入力タイプのテキストで行うだけです。

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

お役に立てれば幸いです。