javascript - 如何使用 jquery 在文本框中只允许数字和 2 位小数

Question

我是 jquery 的新手。我有两个文本框的表格。因为我限制特殊字符。但我想允许十进制值。

我实现了十进制代码但没有工作。 . 不允许。我只想在小数点后允许 2 位数字。

<form>
<div class="col-md-6">
<div class="form-group ">
<label for="minAmt" class="col-lg-4 control-label">Min.Amount</label>
<div class="col-lg-6">
<input type="text" class="form-control minAmt" id="minAmt" name="minAmt" placeholder="Enter Min Amount" />
</div>
</div>
<div class="form-group ">
<label for="maxAmt" class="col-lg-4 control-label">Max.Amount</label>
<div class="col-lg-6">
<input type="text" class="form-control maxAmt" id="maxAmt" name="maxAmt" placeholder="Enter Max Amount" />
</div>
</div>
</div>
</form>

脚本:

$('#minAmt').keyup(function(){
     if($(this).val() == '0'){
      $(this).val('');  
    }
     if (this.value.match(/[^0-9]/g)) {
         this.value = this.value.replace(/[^0-9]/g, '');
 }
 });
 $('.minAmt').keyup(function (e) {
     var character = String.fromCharCode(e.keyCode)
     var newValue = this.value + character;
     if (isNaN(newValue) || hasDecimalPlace(newValue, 3)) {
         e.preventDefault();
         return false;
     }
 });

 function hasDecimalPlace(value, x) {
     var pointIndex = value.indexOf('.');
     return  pointIndex >= 0 && pointIndex < value.length - x;
 }

我的代码有什么问题？

Answer 1

替换:

this.value = this.value.replace(/[^0-9]/g, '');

与

this.value = this.value.replace(/[^0-9_.]/g, '');

这里有点pen用你的代码。

你也可以像这样创建一个 jQuery 函数:

(function($) {
    $.fn.regEx = function(regType) {
        var str = $.trim($(this).val());
        if (regType == "tel") {
            var regx = /^[0-9+./+/-]+$/;
        }

        if (regType == "adr") {
            var regx = /^[A-Za-z0-9+.+,]+$/;
        }

        if (regType == "email") {
            var regx = /^[A-Za-z0-9+@+.+_\-]+$/;
        }

        if (str != "") {

            if (!regx.test(str)) {
                $(this).siblings(".error").css("opacity", "1");
                //alert("Alphanumeric only allowed !");
                $(this).val("");
                setTimeout(function() {
                    $(this).siblings(".error").css("opacity", "0");
                }, 2000);
            } else {
                $(this).siblings(".error").css("opacity", "0");
            }
        } else {
            //empty value -- do something here
        }
    };
})(jQuery);

然后像这样在你想要的元素上使用它:

$("input#email").keyup(function(e) {
    $(this).regEx("email");
});
$("input#telefon").keyup(function(e) {
    $(this).regEx("tel");
});
$("input#telefon").keyup(function(e) {
    $(this).regEx("adr");
});

对于兄弟错误容器，您的 HTML 应该如下所示:

 <div class="form_element_container">
    <label for="email">Email <span class="required">*</span></label>
    <input id="email" type="email" name="email" value="0" />
    <div class="error">*Only specific characters allowed!</div>
</div>