最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Allowing just Numeric Text on Input Text field - Stack Overflow

programmeradmin2浏览0评论

I was using Jquery Numeric plugin but I found that is not working on FireFox 3.6 on Osx (does not allow pasting).

I'm searching a Jquery plugin or Javascript snippet that allows just Numeric Text on an Input Text field.
I have the following requirements:

  1. Should allow just numeric text
  2. Should NOT allow punctuation (.,)
  3. Should NOT allow dashed text (-)
  4. Should allow pasting just for numeric text
  5. Multibrowser
  6. Multiplatform

I was using Jquery Numeric plugin but I found that is not working on FireFox 3.6 on Osx (does not allow pasting).

I'm searching a Jquery plugin or Javascript snippet that allows just Numeric Text on an Input Text field.
I have the following requirements:

  1. Should allow just numeric text
  2. Should NOT allow punctuation (.,)
  3. Should NOT allow dashed text (-)
  4. Should allow pasting just for numeric text
  5. Multibrowser
  6. Multiplatform
Share Improve this question edited Apr 14, 2011 at 7:27 systempuntoout asked May 25, 2010 at 10:32 systempuntooutsystempuntoout 74.1k47 gold badges175 silver badges246 bronze badges 4
  • you may find this usefull stackoverflow./questions/995183/… – Luca Filosofi Commented May 25, 2010 at 10:45
  • are dashes allowed? e.g. -45? – scunliffe Commented May 25, 2010 at 10:46
  • @scunliffe added in the requirements. – systempuntoout Commented May 25, 2010 at 11:00
  • 1 How about stackoverflow./questions/2980038/… with changing a-z to 0-9? – dev-null-dweller Commented Jun 6, 2010 at 21:27
Add a ment  | 

3 Answers 3

Reset to default 7

DEMO: http://so.devilmaycode.it/allowing-just-numeric-text-on-input-text-field/

jQuery.fn.onlyDigits = function() {
    var k;
    // little trick just in case you want use this:
    $('<span></span>').insertAfter(this);
    var $dText = $(this).next('span').hide();
    // Really cross-browser key event handler
    function Key(e) {
        if (!e.which && ((e.charCode ||
        e.charCode === 0) ? e.charCode: e.keyCode)) {
        e.which = e.charCode || e.keyCode;
        } return e.which; }
    return $(this).each(function() {
        $(this).keydown(function(e) {
            k = Key(e);
            return (
            // Allow CTRL+V , backspace, tab, delete, arrows,
            // numbers and keypad numbers ONLY
            ( k == 86 && e.ctrlKey ) || (k == 86 && e.metaKey) || k == 8 || k == 9 || k == 46 || (k >= 37 && k <= 40 && k !== 32 ) || (k >= 48 && k <= 57) || (k >= 96 && k <= 105));
        }).keyup(function(e) {
            var value = this.value.replace(/\s+/,'-');
            // Check if pasted content is Number
            if (isNaN(value)) {
                // re-add stored digits if CTRL+V have non digits chars
                $(this).val($dText.text());
            } else { // store digits only of easy access
                $dText.empty().append(value);
            }
        });
    });
};

USAGE:

$("#onlydigits").onlyDigits();

NOTE:

thanks to Insider for pointing out the past (cmd+v) for MAC


key event handler REFERENCES:

  • http://unixpapa./js/key.html
  • http://www.hallvord./opera/keyevents.htm
  • http://dev.opera./articles/view/keyboard-accessible-web-applications-3/
  • http://qooxdoo/documentation/0.7/keyboard_events
  • http://msdn.microsoft./en-us/library/ms533927(VS.85).aspx
  • http://www.quirksmode/js/keys.html
  • http://www.w3/2002/09/tests/keys-cancel2.html

Thanks to dev-null-dweller i have resolved with this script:

jQuery('#input').bind('keyup blur',function(){ 
   jQuery(this).val( jQuery(this).val().replace(/[^0-9]/g,'') ); }
);

Thanks systempuntoout.. I've fixed this with following script

$('#input').keyup( function() {
  var $this = $(this);
  $this.val($this.val().replace(/[^\d.]/g, ''));     
});
发布评论

评论列表(0)

  1. 暂无评论