如何在输入字段中仅允许使用小数和逗号？

Question

此代码正在处理一个问题。但我需要一个逗号。我在代码中替换了所有指向逗号的点。但它没有用......

我想写12,23 现在我只能写12.23

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

    var text = $(this).val();
    if ((event.which == 46) && (text.indexOf('.') == -1)) {
        setTimeout(function() {
            if ($this.val().substring($this.val().indexOf('.')).length > 3) {
                $this.val($this.val().substring(0, $this.val().indexOf('.') + 3));
            }
        }, 1);
    }

    if ((text.indexOf('.') != -1) &&
        (text.substring(text.indexOf('.')).length > 2) &&
        (event.which != 0 && event.which != 8) &&
        ($(this)[0].selectionStart >= text.length - 2)) {
            event.preventDefault();
    }      
});

$('.number').bind("paste", function(e) {
var text = e.originalEvent.clipboardData.getData('Text');
if ($.isNumeric(text)) {
    if ((text.substring(text.indexOf('.')).length > 3) && (text.indexOf('.') > -1)) {
        e.preventDefault();
        $(this).val(text.substring(0, text.indexOf('.') + 3));
   }
}
else {
        e.preventDefault();
     }
});

.number {
  padding: 5px 10px;
  font-size: 16px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="number" />

Answer 1

您可以使用正则表达式验证文本框值，如下所示：

$('.number').keypress(function(event) {
var $this = $(this);
    var numbers = new RegExp('/^(\d+(?:[\.\,]\d{2})?)$/');

        if (numbers.test($this.val())) {
            alert('Great, you entered valid number');
        }
});

Answer 2

试试这个：

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

            var text = $(this).val();
            if ((event.which == 188) && (text.indexOf(',') == -1)) {
                setTimeout(function () {
                    if ($this.val().substring($this.val().indexOf(',')).length > 3) {
                        $this.val($this.val().substring(0, $this.val().indexOf(',') + 3));
                    }
                }, 1);
            }

            if ((text.indexOf(',') != -1) &&
                    (text.substring(text.indexOf(',')).length > 2) &&
                    (event.which != 0 && event.which != 8) &&
                    ($(this)[0].selectionStart >= text.length - 2)) {
                event.preventDefault();
            }
        });

        $('.number').bind("paste", function (e) {
            var text = e.originalEvent.clipboardData.getData('Text');
            if ($.isNumeric(text)) {
                if ((text.substring(text.indexOf(',')).length > 3) && (text.indexOf(',') > -1)) {
                    e.preventDefault();
                    $(this).val(text.substring(0, text.indexOf(',') + 3));
                }
            } else {
                e.preventDefault();
            }
        });

.number {
  padding: 5px 10px;
  font-size: 16px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="number" />