チェック値の長さは、それが数値の場合

Question

私はテキストボックスの値が数値であるかどうかを確認するには、次のコードを使用しています

：

を次のように

(function ($) { 
    $.fn.numeric = function (options) { 
     return this.each(function() { 
      var $this = $(this); 

      $this.keypress(options, function (e) { 
       // allow backspace and delete 
       if (e.which == 8 || e.which == 0) 
        return true; 

       //if the letter is not digit 
       if (e.which < 48 || e.which > 57) 
        return false; 

       // check max range 
       var dest = e.which - 48; 
       var result = this.value + dest.toString(); 
       if (result > e.data.max) { 
        return false; 
       } 
      }); 
     }); 
    }; 
})(jQuery); 

入力テキストボックス要素に使用して、私はそれを宣言

$(input).numeric({ max: 999}); 

入力に問題があり、 の値が文字列ではなく整数でなければならないという問題があります。

しかし、私はそれも同様に2倍検証するコードを変更する必要があります。

0.22を挿入すると問題ありませんが、0.222 を挿入すると数字が入力されません。

Answer 1

このコードは期待通りに動作するはずです：

(function($) { 
    $.fn.numeric = function(options) { 
     return this.each(function() { 
      var $this = $(this); 

      $this.keypress(options, function(e) { 
       // allow backspace and delete 
       if (e.which == 8 || e.which == 0) { 
        return true; 
       } 

       // allow float 
       if (e.which == 46 && this.value.length >=1 && this.value.indexOf('.') == -1) { 
        return true; 
       } 

       //if the letter is not digit 
       if (e.which < 48 || e.which > 57) return false; 

       // check max range 
       var dest = e.which - 48; 
       var result = this.value + dest.toString(); 
       if (result > e.data.max) { 
        return false; 
       } 
      }); 
     }); 
    }; 
})(jQuery); 

デモ：http://jsfiddle.net/GuillaumeCisco/nGNxG/

Answer 2

チェックこの回答やコメント（特に1受理）助けてください： Validate decimal numbers in JavaScript - IsNumeric()

をそれ以外の場合は、すべてのキー操作であなたの値をチェックする必要が本当にありますか？

Answer 3

私はコードをデバッグしようとしました。 '。'の更新のみが必要です。 '。'のASCII値（ドット）は46です。あなたが以下の変更を行うと動作します！私は変更の上に見たコードalert(parseInt($('input').val()));

と価値を警告することで$('input').numeric({ max: 999});

テストはこの問題を解決:)してください - あなたが引用符で入力をラップする必要が(e.which == 8 || e.which == 0||e.which==46)

と

1. 更新(e.which == 8 || e.which == 0) 、それが動作しない場合私に教えてください:)

Answer 4

それはすべてのkeypressイベントに検証する煩雑になる可能性があり、そしてちょうどキープレスからfalseを返すことは、彼らがそのキーを入力する許可されていない理由をユーザーに知らせていません。あなたはおそらく、ラベルに数字でマークされたフィールドを持っているかもしれませんが、ユーザがあなた自身であっても、あなたに与えることができる余分な助けがあれば、多くの迷惑を節約できます。このようなことはどうですか？

(function($) { 
    $.fn.numeric = function(options) { 
     return this.each(function() { 
      var $this = $(this); 

      $this.blur(function(e) { 
       if (isNaN(+this.value)) { 
        $('<span class="error">Must be numeric</span>').insertAfter($this); 
       } else { 
        $this.next('span.error').remove(); 
       } 
      }); 
     }); 
    }; 
}(jQuery)); 

working example hereがあります。

また、オプションからミニ/マックスチェックを追加する必要があります。私はこの例のためにそれを削除しました。

最後に、多くの検証を実行する場合は、独自のロールアップではなく、jQuery Validationのような検証ライブラリを使用することができます。

Answer 5

私は@Guillaumeによって提案された解決法に従った。しかし、私は、したがって、すべてのコード

(function ($) { 

    $.fn.numeric = function (options) { 

     return this.each(function() { 
      var $this = $(this); 

      $this.keypress(options, function (e) { 

       // allow backspace and delete 
       if (e.which == 8 || e.which == 0) 
        return true; 

       if (e.which == 46 && this.value.length >= 1 && this.value.indexOf('.') == -1) { 
        return true; 
       } 
       //if the letter is not digit 
       if (e.which < 48 || e.which > 57) 
        return false; 

       // check max range 
       var dest = e.which - 48; 
       var result = this.value + dest.toString(); 
       if (result > e.data.max) { 
        return false; 
       } 

       if (this.value.length > e.data.maxLength) 
        return false; 
      }); 
     }); 
    }; 
})(jQuery); 

の下に追加の条件に

if (this.value.length > e.data.maxLength) 
      return false; 

を追加し、それが

$(input).numeric({ max: 999,maxLength:4}); 

maxLengthを使用する - プロパティは、最大入力長