将输入框限制为0-100

我有一个输入框,取值从0到100。 我想阻止用户写任何更大或更小的东西。

我一直在使用jquery keyfilter插件来限制字段的输入: http : //code.google.com/p/jquery-keyfilter/

此插件可以将输入限制为数字,但不在一定范围内。 如何阻止用户输入超出范围的数字。 谢谢。

使用像这样的普通Javascript:

 

然后像这样声明输入框:

  

因为您已将此函数挂钩到onchange(),即使用户将某些内容复制/粘贴到输入框中,它也会起作用。

我建议使用jQuery Validation插件。 非常灵活和可扩展。 要处理您的范围查询以下内容。 它将certificate表单中标有“百分比”类的任何输入都存在且属于给定范围。

 $("#myform").validate({ rules: { percentage: { required: true, range: [0, 100] } } });  

我建议使用该插件的原因是它可以处理许多开箱即用的validation情况,使您免除了为许多场景编写validation代码的责任 – 您可以以更好的方式花费您的创意。 它也被许多人使用,因此具有被大型社区改进的附加优势。

更新 :此外,您可能需要考虑一种替代输入机制,例如滑块 ( 演示 ),它将以不受用户错误影响的方式约束数据 – 或者至少不是这种特定类型的错误。

HTML5添加了几种新的输入类型 ,包括number

 
Quantity (between 1 and 100):

旧版Web浏览器不支持的新输入类型将表现为

来自W3Schools的Runnable示例 。

您可以使用Math.max和Math.min

 val = Math.min(100,Math.max(0,val)); 
   

您只需要在每次击键之后以及在将其发送到字段之前测试字段的值(例如,使用按键事件处理程序) – 如果新击键会创建一个太高的值,则拒绝按键。

例如 – 如果当前值为20并且用户尝试键入第三个数字,则应通过从事件处理程序返回false来拒绝按键。 基本上,您应该允许的唯一第三个字符是“0”,并且仅当前字段值为“10”时。

通过jQuery来做到这一点

  

如果数字不在0 – 100之间,则为空输入字段

  

如果它只是用于不超过20的字符数(例如),那么你可以使用

  

如果您需要在输入字段中处理其他一些情况,那么函数将是更好的选择。