Javascript 使用jQuery将文本框输入限制为给定的regexp

考虑以下文本框：

<input type="text" name="quantity" id="quantity_field" />

更具体地说，我想让浏览器放弃在

quantity\u字段

中输入的任何字符，这些字符会使文本字段的值不符合给定的regexp。（当然，在服务器端也会进行相应的检查。）

示例：

• 如果用户键入“foo 234”，文本框中只会输入“234”
• 如果用户键入“001230”，文本框中只会输入“1230”
• 如果用户键入“foo1bar”，文本框中只会输入“1”

---

问：使用jQuery实现这一点最简单的方法是什么？

不是对您的问题的回答（因为我不了解jQuery），但是regex

^[1-9]*[0-9]*$

可能不会按照您的预期或想法执行。它匹配空字符串，但也匹配像

000000

这样的数字。我希望您不希望这样，因为您的第一个字符类

[1-9]

显式忽略了零。我认为您应该将第一个

*

更改为

+

：

^[1-9]+[0-9]*$

。但是，该正则表达式将拒绝（单个）数字

0

。如果您想包括这一点，您应该这样做：

^（0 |[1-9]+[0-9]*）$

不是对您的问题的回答（因为我不知道jQuery），但是正则表达式

^[1-9]*[0-9]*$

可能不会按照您的预期或想法执行。它匹配空字符串，但也匹配像

000000

这样的数字。我希望您不希望这样，因为您的第一个字符类

[1-9]

显式忽略了零。我认为您应该将第一个

*

更改为

+

：

^[1-9]+[0-9]*$

。但是，该正则表达式将拒绝（单个）数字

0

。如果您想包含这些内容，您应该执行：

^（0 |[1-9]+[0-9]*）$

我建议您让用户随意查看，然后在提交表单时进行验证。（当然，您仍然必须在服务器端进行检查，因为他可以轻松禁用或更改javascript验证代码）

为了验证，请查看

---

我建议您让用户随意查看，然后在提交表单时进行验证。（当然，您仍然必须在服务器端进行检查，因为他可以轻松禁用或更改javascript验证代码）

为了验证，请查看

定义一个全局变量“oldVal”（下文未描述），该变量包含最后一个已知的有效值。绑定到输入字段的向下键操作：

<script>
    $("#quantity_field").keydown(function() {
        var newVal = $("#quantity_field").val();
        var quantityRegexp = /^(0|[1-9]+[0-9]*)$/;

        // success
        if (quantityRegexp.test(newVal)) {
            oldVal = newVal;
            // hide error
            $("#quantity_field_error").hide();
        }

        // else failure
        else {
            $("#quantity_field").val(oldVal);
            // display error message
            $("#quantity_field_error").show();
        }
    });
</script>

$（“#数量_字段”）.keydown（函数（）{
var newVal=$（“#数量_字段”）.val（）；
var quantityRegexp=/^（0 |[1-9]+[0-9]*）$/；
//成功
if（quantityRegexp.测试（新值））{
oldVal=newVal；
//隐藏错误
$（“#数量#字段#错误”）.hide（）；
}
//否则失败
否则{
$（“#数量#字段”）.val（oldVal）；
//显示错误消息
$（“#数量#字段#错误”）.show（）；
}
});

这应该让您开始定义一个全局变量“oldVal”（下文未描述），它包含最后一个已知的正确值。绑定到输入字段的向下键操作：

<script>
    $("#quantity_field").keydown(function() {
        var newVal = $("#quantity_field").val();
        var quantityRegexp = /^(0|[1-9]+[0-9]*)$/;

        // success
        if (quantityRegexp.test(newVal)) {
            oldVal = newVal;
            // hide error
            $("#quantity_field_error").hide();
        }

        // else failure
        else {
            $("#quantity_field").val(oldVal);
            // display error message
            $("#quantity_field_error").show();
        }
    });
</script>

$（“#数量_字段”）.keydown（函数（）{
var newVal=$（“#数量_字段”）.val（）；
var quantityRegexp=/^（0 |[1-9]+[0-9]*）$/；
//成功
if（quantityRegexp.测试（新值））{
oldVal=newVal；
//隐藏错误
$（“#数量#字段#错误”）.hide（）；
}
//否则失败
否则{
$（“#数量#字段”）.val（oldVal）；
//显示错误消息
$（“#数量#字段#错误”）.show（）；
}
});

---

这应该让您开始

如果您不知道用户要输入多少个字符（并且只想将它们限制为数字），则最好选择

$('form.to-validate').validate({
   rules: {
      quantity: { digits: true }
   }
});

这将只允许用户输入数字。如果您知道此人要键入多少字符，那么我还建议使用for jQuery，这将为用户提供一个很好的视觉指示，说明他们需要键入什么，并防止他们在字段中输入您不需要的字符

如果您不只是追求数字，并且必须对照正则表达式进行检查，那么有一种方法可以向jQuery验证插件添加自定义验证方法，这应该可以满足您的需要

---

希望有帮助

如果您不知道用户要输入多少个字符（并且只想将其限制为数字），则最好选择

$('form.to-validate').validate({
   rules: {
      quantity: { digits: true }
   }
});

这将只允许用户输入数字。如果您知道此人要键入多少字符，那么我还建议使用for jQuery，这将为用户提供一个很好的视觉指示，说明他们需要键入什么，并防止他们在字段中输入您不需要的字符

如果您不只是追求数字，并且必须对照正则表达式进行检查，那么有一种方法可以向jQuery验证插件添加自定义验证方法，这应该可以满足您的需要

---

希望有帮助

接得好！我已经调整了问题中的regexp。谢谢抢手货我已经调整了问题中的regexp。谢谢谢谢，但在这种情况下，我真的希望在输入时进行过滤，而不是在提交时。谢谢，但在这种情况下，我真的希望在输入时进行过滤，而不是在提交时。默认情况下，屏蔽输入插件在输入时进行验证，如果配置正确，jQuery验证插件可以在向上键事件（输入）上执行此操作。请参阅文档中的

validate（）

选项，特别是

onkeyup:true

。哦，我不知道。谢谢。谢谢，但在这种情况下，我真的希望在输入时进行过滤，而不是在提交时。