我知道我最近一直在问有关jQuery验证的问题，但是我认为我的问题现在归结为基本要点。
因此，如果我有此HTML页面：
<html>
<head>
<title>validation test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.validate.js"></script>
</head>
<body>
<form id="theform">
<div id="num" name="num">86</div>
</form>
<script type="text/javascript">
var validationObject = {
rules: {
num: {
numtest:true
}
}
};
$.validator.addMethod("numtest", function(value, element) {
return value == 42;
});
$('form').validate(validationObject);
if ($("form").valid())
alert("VALID");
else
alert ("INVALID");
</script>
</body>
</html>
然后我希望警报为"INVALID"，因为num是86而不是42。但是我得到的是"VALID";我定义的用于验证的函数没有被调用（我在return value == 42;上设置了一个断点，并且它从未被命中）。为什么是这样？如何确保验证函数被调用？
您在自定义方法中缺少验证错误消息。您还应该使用this.optional(element)，以便可以将该字段留空并单独使用required规则。 （（您编写的方式，该字段也是必填项。）
$.validator.addMethod("numtest", function(value, element) {
return this.optional(element) || (value == 46);
}, "validation error message");
将整个内容放入ready处理程序中，以确保在调用.validate()方法之前该表单存在。 （但是，这并不是破坏表单的原因，因为在HTML之后调用了JavaScript。）>
此插件无法识别div，因为它不是有效的表单输入元素。将其更改为<input />，<select>或<textarea>元素。
<input type="text" id="num" name="num" />
第3项是唯一会破坏您的代码的东西。
正在运行的演示：jsfiddle.net/c38uxh6m/
请仔细阅读SO Wiki page和大量在线示例。