范围0-100使用jQuery inputmask插件 [英] Range 0-100 using jQuery inputmask plugin

查看:216
本文介绍了范围0-100使用jQuery inputmask插件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

  $(document).ready(function(){

如何创建范围从0到100的蒙版?
$(#masked)。inputmask(???);
});


解决方案

您可以使用 jquery .inputmask.regex.extensions.js 。你可以找到所有扩展名的原始js on this链接。有关正则表达式扩展(以及所有其他扩展)的github部分可以在 jquery.inputmask #regex-extensions



如果您包含该扩展名,您可以简单地使用以下正则表达式:

  ^ [1-9] [0-9]?$ | ^ 100 $ 

这匹配1或2位数字和100。

然后,您只需将它作为正常传递给inputmask插件:

>

HTML



 测试:< input type =textid =例1\" > 



JavaScript



  $(document).ready(function(){
$(#example1)。inputmask('Regex',{regex:^ [1-9] [0-9]?$ | ^ 100 $});
});

这是一个jsFiddle来证明它的工作原理:



>查看演示






编辑1



我刚才看到您想匹配 0-100 与> 1-100 相反

匹配 0-100 ,只需将^ [1-9] [0-9]?$ | ^ 100 $更改为^ [0-9] [0-9]?$ | ^ 100 $



^ [ 1 -9] [0-9]?$ | ^ 100 $中的 1 改为 0 。更正后的jsFiddle可以在 这里






编辑2



2015年1月14日,现在也可以使用数字扩展名。使用该扩展,您现在可以简单地对整数范围执行以下操作:

  $(#example1)。inputmask 'integer',{min:1,max:100}); 

对于十进制数字:

<$ p $ (#example1)。inputmask('decimal',{min:1,max:100});

请参阅演示






编辑3



截至2016年9月,语法发生了变化:

  $(#example1)。inputmask(numeric,{ 
min:0,
max:100
});



参见新的DEMO



请注意,它现在只能在 之后才能使用号码,并且用户点击了某处的输入框。


How can I create mask for range from 0 to 100?

$(document).ready(function() {
    $("#masked").inputmask(???);
});

解决方案

You can use the jquery.inputmask.regex.extensions.js for that. You can find the raw js with all extensions on this link. The github part about the regex extension (and all the other extensions) can be found on jquery.inputmask#regex-extensions.

When you have that extension included, you can simply use the following regex:

^[1-9][0-9]?$|^100$

This matches 1 or 2 digits and the number 100.

Then you simply pass it to the inputmask plugin as normal:

HTML

Test: <input type="text" id="example1">

JavaScript

$(document).ready(function(){
    $("#example1").inputmask('Regex', { regex: "^[1-9][0-9]?$|^100$" });
});

Here is a jsFiddle to prove that it works:

> SEE DEMO


Edit 1

I just saw that you wanted to match 0-100 opposed to the 1-100 I did above.

For matching 0-100, simply change "^[1-9][0-9]?$|^100$" to "^[0-9][0-9]?$|^100$"

Where I changed the 1 in "^[1-9][0-9]?$|^100$" to a 0. The corrected jsFiddle can be found here.


Edit 2

As of January 14, 2015, it is now also possible by using the numeric extension. With that extension, you can now simply do the following for an integer range:

$("#example1").inputmask('integer',{min:1, max:100});

And for decimal numbers:

$("#example1").inputmask('decimal',{min:1, max:100});

See demo.


Edit 3

As of September 2016, the syntax has changed:

$("#example1").inputmask("numeric", {
  min: 0,
  max: 100
});

See NEW DEMO

Mind you that it now only works after the number has been entered and the user has clicked somewhere outside of the input box.

这篇关于范围0-100使用jQuery inputmask插件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆