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

Question

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

 $().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) {

            }
        });
    });

如果可能的话，请给我脚本，这将使我的文本框只有数字和十进制数字。谢谢

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

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

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

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

所以请帮助我。谢谢

score 46 · Accepted Answer

你不能在活动中使用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

    });
});

小提琴

score 20 · Accepted Answer

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

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

演示。

score 5 · Accepted Answer

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

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

$(".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;
    }
});

score 2 · Accepted Answer

防止非数字数字

        $(".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
        });

score 1 · Accepted Answer

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

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

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

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

score 1 · Accepted Answer

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

score 1 · Accepted Answer

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

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

放到html页面上：

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

score 0 · Accepted Answer

你可以试试http://www.texotela.co.uk/code/jquery/numeric/

该线程提到了相同的插件以及您可以尝试的许多其他事情。

score 0 · Accepted Answer

//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 = '' ;
  }  
});
});

score 0 · Accepted Answer

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

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

检查小提琴。

score 0 · Accepted Answer

试试这个代码

$('#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"/>

score 0 · Accepted Answer

element.keypress(function (e) { 
    var charCode = (e.which) ? e.which : event.keyCode;
    var dec=0;

    dec = (this.value.match(/[.]/g) || [] ).length;

    if(dec===1 && e.key=='.')
        return false;

    if (charCode > 31 && (charCode < 48 || charCode > 57) && charCode!=46)
        return false;

});

score 0 · Accepted Answer

1 允许第一个字符点 2 拒绝多个点 3 允许两个点键

在您的 HTML 中

<input class="number" type="number" log="" id="yourId" log="" />

$('#yourId').keypress(KeyPressOnlyDecimals);


function KeyPressOnlyDecimals (event) {

   if (event.which != 13)
        {
                let cId = $(window.getSelection().anchorNode).find('input')[0].id;
                let tId = $(event.currentTarget).attr('id');
                let sel = window.getSelection().toString();

                if (((event.which != 46  ) || ($(this).val().indexOf('.') != -1  && ($(event.currentTarget).val().length > 0 &&  ((cId != tId) || (cId === tId && (sel == null || sel.length == 0)))))) && (event.which < 48 || event.which > 57)) {
                    event.preventDefault();
                }
                $(event.currentTarget).on('paste', function(event) {
                    event.preventDefault();
                });
                var currentVal = $(event.currentTarget).val();

                let log =   $(event.currentTarget).attr('log');
                var count = log.split('.').length;
                if (count == 2 && event.which == 46 && sel != currentVal)
                {
                    event.preventDefault();
                }

                if (count >= 2)
                {

                    if (cId === tId && sel.length > 0)
                    {
                        var replaced = currentVal.replace(new RegExp(sel, 'g'), event.key);

                    }

                    if (count > 2 && $(event.currentTarget).val().length > 0 &&  ((cId != tId) || (cId === tId && (sel == null  || sel.length == 0) ))) 
                    {
                        event.preventDefault();
                    }

                }
                else
                {
                    if(event.which == 46)
                        $(event.currentTarget).attr('log',event.key);
                }

                console.log($(event.currentTarget).attr('log'));

        }
  }

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

13 回答 13

小提琴

Related

Reference