Javascript 范围 0-100 使用 jQuery inputmask 插件

Range 0-100 using jQuery inputmask plugin

提问by NieAR

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

如何为 0 到 100 的范围创建掩码？

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

回答by Jean-Paul

You can use the jquery.inputmask.regex.extensions.jsfor 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.

您可以jquery.inputmask.regex.extensions.js为此使用。您可以在此链接上找到带有所有扩展名的原始 js 。关于正则表达式扩展（以及所有其他扩展）的 github 部分可以在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.

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

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

然后你只需像往常一样将它传递给 inputmask 插件：

HTML

HTML

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

JavaScript

JavaScript

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

Here is a jsFiddle to prove that it works:

这是一个 jsFiddle 来证明它有效：

> SEE DEMO

> 看演示

---

---

Edit 1

编辑 1

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

我刚刚看到你想要匹配0-100与1-100我上面所做的相反。

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

对于匹配0-100，只需更改"^[1-9][0-9]?$|^100$"为"^[0-9][0-9]?$|^100$"

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

当我改变了1在“^ [ 1？-9] [0-9] $ | ^ $ 100”到0。可以找到更正后的 jsFiddle here。

---

---

Edit 2

编辑 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:

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

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

And for decimal numbers:

对于十进制数：

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

See demo.

见演示。

---

---

Edit 3

编辑 3

As of September 2016, the syntax has changed:

截至 2016 年 9 月，语法已更改：

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

See NEW DEMO

查看新演示

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

请注意，它现在仅在输入数字并且用户单击输入框外的某处后才起作用。

回答by brandelizer

You can make this with simple html!! http://www.w3schools.com/tags/att_input_min.asphttp://www.w3schools.com/tags/att_input_max.asp

你可以用简单的 html 来做这个！！ http://www.w3schools.com/tags/att_input_min.asp http://www.w3schools.com/tags/att_input_max.asp

回答by TheGr8_Nik

Based on the inputmask plugin hompage:

基于inputmask 插件主页：

$(selector).inputmask("99-9999999");