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>

Answer 2

你可以尝试这个例子：

  $('#minAmt').keyup(function(e) {
    onlyNumeric(e);
    var val= $(this).val();
    if (val=== '') {
        $(this).val('0.00');
    }
  else{
      $(this).val(val.toFixed(2));
   }
    });

function onlyNumeric(evt) {
    var theEvent = evt || window.event;
    var key = theEvent.keyCode || theEvent.which;
    var exclusions = [8, 46];
    if (exclusions.indexOf(key) > -1) {
        return;
    }
    key = String.fromCharCode(key);
    var regex = /[0-9]|\./;
    if (!regex.test(key)) {
        theEvent.returnValue = false;
        if (theEvent.preventDefault) theEvent.preventDefault();
    }
}

或

$('#minAmt').keyup(function (e) { var theEvent = evt || window.event; var key = theEvent.keyCode || theEvent.which; var exclusions = [8, 46]; if (exclusions.indexOf(key) > -1) { return; } key = String.fromCharCode(key); var regex = /^\d+(\.\d{0,2})?$/g; if (!regex.test(key)) { theEvent.returnValue = false; if (theEvent.preventDefault) theEvent.preventDefault(); } var val = $(this).val(); if (!regex.test(val)) { $(this).val('0.00'); } else { $(this).val(val.toFixed(2)); } });

Answer 3

以下是允许用户仅输入数字和单个句点（。）的解决方案。

$('#text').keypress(function (event) {
        return isNumber(event, this)
});

// THE SCRIPT THAT CHECKS IF THE KEY PRESSED IS A NUMERIC OR DECIMAL VALUE.
function isNumber(evt, element) {
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (            
        (charCode != 46 || $(element).val().indexOf('.') != -1) &&      // “.” CHECK DOT, AND ONLY ONE.
        (charCode < 48 || charCode > 57))
        return false;
        return true;
}

或者

<input id="txtId" type="text"></input>

var txt = document.getElementById('txtId');
txt.addEventListener('keyup', myFunc);

function myFunc(e) {
  var val = this.value;
  var re = /^([0-9]+[\.]?[0-9]?[0-9]?|[0-9]+)$/g;
  var re1 = /^([0-9]+[\.]?[0-9]?[0-9]?|[0-9]+)/g;
  if (re.test(val)) {
    //do something here

  } else {
    val = re1.exec(val);
    if (val) {
      this.value = val[0];
    } else {
      this.value = "";
    }
  }
}

我希望这能满足您的需求。

Answer 4

我建议您收听catch事件，因为可以使用鼠标和/或上下文菜单进行修改，但不会生成input个事件。

然后，您可以跟踪可接受的最后一个值，并在输入无效时恢复该值。您可以将以前的值作为数据属性进行管理：

＆＃13;

keyup

＆＃13;

$(function () {
    $('#minAmt,#maxAmt').on('input', function(e) {
        if (/^(\d+(\.\d{0,2})?)?$/.test($(this).val())) {
            // Input is OK. Remember this value
            $(this).data('prevValue', $(this).val());
        } else {
            // Input is not OK. Restore previous value
            $(this).val($(this).data('prevValue') || '');
        }
    }).trigger('input'); // Initialise the `prevValue` data properties
});

＆＃13;

如何使用jquery仅允许文本框中的数字和2位十进制

4 个答案:

或者