如何使用 jQuery 允许数字 (0-9) 和十进制值文本框？

How to allow numeric (0-9) & decimal value textbox using jQuery?

提问by Thomas

i wrote few line to accept only numeric character but my script is not working. when i type any alphabet then it is getting inserted into textbox which i do not want. i want that textbox should accept only numeric value and "." point for decimal. here is my script. just tell me what is wrong there.

我写了几行只接受数字字符，但我的脚本不起作用。当我输入任何字母时，它就会被插入到我不想要的文本框中。我希望文本框应该只接受数值和“。” 点为小数点。这是我的脚本。告诉我那里出了什么问题。

 $().ready(function () {
        $("input[id*='txtQty']").keyup(function (event) {
            var flag = false;

            if (event.shiftKey == true) {
                event.preventDefault();
            }
            // Allow Only: keyboard 0-9, numpad 0-9, backspace, tab, left arrow, right arrow, delete
            if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46) {
                // Allow normal operation
                flag = true;
            } else {
                // Prevent the rest
                event.preventDefault();
            }

            if (flag) {

            }
        });
    });

if possible please give me script which will enable my textbox only numeric and decimal number. thanks

如果可能，请给我脚本，该脚本将使我的文本框仅启用数字和十进制数。谢谢

here is my full script. the problem is it is taking dot "."which i dont want.

这是我的完整脚本。问题是它正在使用点“。” 我不想要的。

        $().ready(function () {
        $("input[id*='txtQty']").keydown(function (event) {
            var flag = true;

            if (event.shiftKey == true) {
                event.preventDefault();
                flag = false;
            }

            if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190) {

            } else {
                event.preventDefault();
                flag = false;
            }

            if (flag) {
                if (jQuery.trim(this.value) != "") {
                    if (IsNumeric(jQuery.trim(this.value)) == true) {
                        var Symbol = $("span[id*='lblPrice']").text().trim().substring(1, 0);
                        var oldprice = $("input[id*='txtHiddenPrice']").val();
                        var newprice = Math.round((oldprice * this.value), 2);
                        $("span[id*='lblPrice']").text(Symbol + newprice);
                        UpdateCart($(this).closest('tr').find("input[id*='txtItemId']").val(), $(this).closest('tr').find("input[id*='txtProductId']").val(), this.value);
                    }
                }
            }
        });
    });

so tell me what i need to change in my code as a result it should not take decimal value. another important thing i attach keydown() event with wild card system because my page may have many textbox with name end like txtQty.

所以告诉我我需要在我的代码中更改什么，因为它不应该采用十进制值。另一件重要的事情我用通配符系统附加 keydown() 事件，因为我的页面可能有许多文本框，名称以txtQty 结尾。

 $("input[id*='txtQty']").keyup(function (event) {

so please help me. thanks

所以请帮助我。谢谢

回答by Johan

You cant use e.preventDefault()it on the keyupevent. Change it to keydown.

你不能e.preventDefault()在keyup活动中使用它。将其更改为keydown.

$(function () {
    $("input[id*='txtQty']").keydown(function (event) {


        if (event.shiftKey == true) {
            event.preventDefault();
        }

        if ((event.keyCode >= 48 && event.keyCode <= 57) || 
            (event.keyCode >= 96 && event.keyCode <= 105) || 
            event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 ||
            event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190) {

        } else {
            event.preventDefault();
        }

        if($(this).val().indexOf('.') !== -1 && event.keyCode == 190)
            event.preventDefault(); 
        //if a decimal has been added, disable the "."-button

    });
});?

Fiddle

小提琴

回答by xdazz

You could remove the non numeric char when keyup.

您可以在键入时删除非数字字符。

$("#txtQty").keyup(function() {
    var $this = $(this);
    $this.val($this.val().replace(/[^\d.]/g, ''));        
});?

The demo.

演示。

回答by mpalencia

Create a numbers-onlyclass and add it to your element

创建一个仅限数字的类并将其添加到您的元素中

This will accept:
- backspace
- delete
- numbers
- one decimal

这将接受：
- 退格
- 删除
- 数字
- 一位小数

$(".numbers-only").keypress(function (e) {
    if(e.which == 46){
        if($(this).val().indexOf('.') != -1) {
            return false;
        }
    }

    if (e.which != 8 && e.which != 0 && e.which != 46 && (e.which < 48 || e.which > 57)) {
        return false;
    }
});

回答by Shira Asulin

Preventing non-numeric numbers

防止非数字数字

        $(".number").on('keypress', function (e) {
            return e.metaKey || e.which <= 0 || e.which == 8 || e.which == 46 || /[0-9]/.test(String.fromCharCode(e.which));
            //      cmd/ctrl ||  arrow keys  ||   delete key ||   dot key     || numbers
        });

回答by Carlos Toledo

My solution accept Copy&Paste and save the position of the caret. It's used for cost of products so allows positive decimal values only. Can be refactor very easy to allow negative or just integer digits.

我的解决方案接受复制和粘贴并保存插入符号的位置。它用于产品成本，因此仅允许正十进制值。可以很容易地重构以允许负数或仅允许整数位。

$(function () {
    $("input.only-positive-decimal").bind("change keyup input", function () {
            var position = this.selectionStart - 1;
                //remove all but number and .
                var fixed = this.value.replace(/[^0-9\.]/g, '');
                if (fixed.charAt(0) === '.')                  //can't start with .
                    fixed = fixed.slice(1);

                var pos = fixed.indexOf(".") + 1;
                if (pos >= 0)               //avoid more than one .
                    fixed = fixed.substr(0, pos) + fixed.slice(pos).replace('.', '');

                if (this.value !== fixed) {
                    this.value = fixed;
                    this.selectionStart = position;
                    this.selectionEnd = position;
                }
    });
});

Put on the html page:

放在html页面：

<input type="text" class="only-positive-decimal" />

回答by Ryan S

This solution only apply if you didn't include decimal number or only number from 0-9

此解决方案仅适用于不包含十进制数字或仅包含 0-9 的数字的情况

$("#number").keypress(function( event ){
    var key = event.which;

    if( ! ( key >= 48 && key <= 57 ) )
        event.preventDefault();
});

you can view the running sample here http://jsfiddle.net/yghD3/6/

您可以在此处查看运行示例http://jsfiddle.net/yghD3/6/

回答by Ryan S

$('.number').keypress(function(event) {
  if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) {
    event.preventDefault();
  }
});

回答by Steve

//This will let you enter numbers only and the decimal point ones.

$(window).load(function(){
$('.number').keypress(function(event) {
  if(event.which < 46 || event.which >= 58 || event.which == 47) {
    event.preventDefault();
  }

  if(event.which == 46 && $(this).val().indexOf('.') != -1) {
    this.value = '' ;
  }  
});
});

回答by Nana Partykar

It will allow only 1 to 9 numbersand decimal. If other characters are being inserted, it will replace those digits.

它只允许1 到 9 个数字和十进制。如果正在插入其他字符，它将替换这些数字。

<script>
  $("input[id*='txtQty']").keydown(function () {
    var txtQty = $(this).val().replace(/[^0-9\.]/g,'');
    $(this).val(txtQty);
  });
</script>

Check in fiddle.

检查小提琴。

回答by karthik E

Try this code

试试这个代码

$('#from-amount1').keypress(function(event) {
//alert(event.which == 8);
//alert(event.which);
    if((event.which > 47 && event.which < 58) || (event.which == 46 || event.which == 8))
    {
      // your condition
    }
    else
    {
    event.preventDefault();
    }
}).on('paste', function(event) {
    event.preventDefault();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<input type="text" value="" id="from-amount1"/>