JQuery年龄验证的正则表达式

Question

我试图使用jQuery和RegEx执行年龄验证，但它似乎不起作用。我在RegEx上尝试了两种不同的尝试-在我的代码中注释掉了一个。我试图显示一个错误，如果输入的年龄小于16使用以下代码:

jQuery.validator.addMethod("ageCheck",
function (value, element) {
//var age = /^([1-9]d|[6-9]d{2})$/;
var age = /^(1[6789]|[2-9]d)$/;
return this.optional(element) || age.test(value);
},
"Age must be greater than or equal to 16"

);

Answer 1

在评论中，我试图建议您使用更好的方法来处理年龄值的验证，而不是使用正则表达式。

不幸的是，你没有在更细致的方式中包含任何关于什么不起作用的线索，而且在你的问题中你只包含了整个画面的一小部分。

所以我不能说你做错了什么因为你没有分享任何细节。但是我可以在你的自定义验证器周围添加你所缺少的东西。

这是一个工作示例，您可以在表单中提交年龄字段，并且可以看到错误消息(如果有的话)。只要输入文本失去焦点，就会触发验证。因此，不需要强制提交来查看它的实际操作。

下面是一些我用来学习插件的参考资料:

• https://jqueryvalidation.org/documentation/
• https://jqueryvalidation.org/jQuery.validator.addMethod/
在jQuery验证插件中使用addMethod

//on document ready
$(document).ready(function() {
//defines your custom validator called ageRangeValidation
$.validator.addMethod(
'ageRangeValidation',
ageCheck,
'Age must be greater than or equal to 16'
);
//initializes the validation for the given form
$('#myform').validate({ 
//rules
rules: {
age: {
//including your custom defined validator bound to the age field here
ageRangeValidation: true
}
}
});

});
//your validation logic for the age field
const ageCheck = (value, element) => {
if (parseInt(value) >= 16)
return true;
else
return false;
}

.error{
color: red;
font-style: italic;
display: block;
}
button[type='submit']{
margin-top: 20px;
cursor: pointer;
display: block;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js"></script>
<form id="myform">
<input type="text" id="age" name="age"/>
<label id="age-error" class="error" for="age"></label>

<button type="submit">Submit</button>
</form>