jQuery 输入掩码小数点

Cod*_*-JR 2 javascript jquery jquery-inputmask

我正在使用https://github.com/RobinHerbots/jquery.inputmask 上的 jQuery 插件,但我似乎无法推导出对应于整数和小数的模式。例如,

我需要以下内容才有效:

      10
      150
      12.25
      0.45
Run Code Online (Sandbox Code Playgroud)

目前我正在做:

$('#from_id').inputmask("9{0,5}.9{0,2}");
Run Code Online (Sandbox Code Playgroud)

但这意味着如果用户不指定小数点后的内容,则结果输出为:

例如,如果用户只想输入 12(并且他没有指定小数点),则输出为

12___.__
Run Code Online (Sandbox Code Playgroud)

(因为掩码正在等待小数点)

但是如果用户指定小数点,例如 12.00,输出很好,如:

12.00 
Run Code Online (Sandbox Code Playgroud)

有人可以帮我解决这个问题吗?

Roh*_*mar 5

尝试使用可选参数,greedy例如,

$('#from_id').inputmask({'mask':"9{0,5}.9{0,2}", greedy: false});
Run Code Online (Sandbox Code Playgroud)

阅读optional-masks-with-greedy-false

您可以验证上面的掩码。或者使用你自己的逻辑来验证,

$(function(){
    $('#id').on('keyup', function(e) {
        if (!this.value.match(/^\d{0,5}(\.[0-9]{1,2})?$/)) {
            $(this).addClass('error');// adding error class
        } else {
            $(this).removeClass('error');// remove error class
        }
    });
});
Run Code Online (Sandbox Code Playgroud)

演示

或者简单地使用toggleClass 之类的,

$('#from_id').inputmask({'mask':"9{0,5}.9{0,2}", greedy: false});
Run Code Online (Sandbox Code Playgroud)
$(function(){
    $('#id').on('keyup', function(e) {
        if (!this.value.match(/^\d{0,5}(\.[0-9]{1,2})?$/)) {
            $(this).addClass('error');// adding error class
        } else {
            $(this).removeClass('error');// remove error class
        }
    });
});
Run Code Online (Sandbox Code Playgroud)
$(function() {
  $('#id').on('keyup', function(e) {
    $(this).toggleClass('error', !this.value.match(/^\d{0,5}(\.[0-9]{1,2})?$/));
  });
});
Run Code Online (Sandbox Code Playgroud)