永远不会调用 jQuery 验证方法

Question

我知道我最近一直在问关于 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/jquery-validation@1.19.1/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;上设置了一个断点return value == 42;并且它永远不会被命中）。 为什么是这样？ 如何确保调用验证函数？

Answer 1

您在自定义方法中缺少验证错误消息。 您还应该使用this.optional(element)以便您可以将该字段留空并单独使用required规则。 （按照您的编写方式，该字段也是必填字段。）
```
 $.validator.addMethod("numtest", function(value, element) { return this.optional(element) || (value == 46); }, "validation error message");
```
将整个内容放在一个ready处理程序中，以确保在调用.validate()方法之前表单存在。 （但是，这并不是破坏表单的原因，因为 JavaScript 是在 HTML 之后调用的。）
此插件无法识别div因为它不是有效的表单输入元素。 将其更改为<input /> 、 <select>或<textarea>元素。
```
 <input type="text" id="num" name="num" />
```

第 3 项是唯一会破坏您的代码的东西。

工作演示： jsfiddle.net/c38uxh6m/

请仔细查看SO Wiki 页面和大量在线示例。

永远不会调用 jQuery 验证方法

问题描述

1 个解决方案

解决方案1
1 已采纳 2020-02-21 01:42:46

永远不会调用 jQuery 验证方法

问题描述

1 个解决方案

解决方案1 1 已采纳 2020-02-21 01:42:46

解决方案1
1 已采纳 2020-02-21 01:42:46