Question

在jQuery Validate插件的示例中，我看到了三种不同的方法来声明验证规则：

CSS类 - 例如<input type="text" name="whatever" class="required" />
属性 - 例如<input type="text" name="whatever" required />
JS代码 - 例如$("#myForm").validate({ rules: { whatever: "required", ... } });

但我没有在文档中看到任何解释为什么你使用其中一个的原因。我也没有看到如何在每种方法中使用validation methods的解释（例如，如何将“max（value）”方法与tag属性或css类一起使用？）。

这三种方法之间的权衡是什么？您是如何使用每种方法声明所有不同的验证方法？

Answer 1

您可以通过数据规则属性应用规则。这是最简单的方法，可能是维护干净代码的最佳方式......

示例：

<form id="myform">
    <input type="text" name="email" data-rule-required="true" data-rule-email="true">    
    <input type="text" name="password" id="password" data-rule-required="true" data-rule-minlength="6">
    <input type="text" name="password-confirm" data-rule-required="true" data-rule-minlength="6" data-rule-equalto="#password">
</form>

您甚至可以通过数据属性提供消息：

<input id="cemail" name="email" data-rule-required="true" data-rule-email="true" data-msg-email="Please enter a valid email address" />

在JavaScript中只需致电：

$('#myform').validate();

Answer 2

来自文档http://jqueryvalidation.org/rules：

有几种方法可以指定验证规则。


不带参数的验证方法可以指定为元素上的类（推荐）

带参数的验证方法可以指定为属性（推荐）

两者都可以使用元数据插件指定为元数据[[[请注意，这已被弃用，因此文档似乎过时了]]]

两者都可以使用validate（） - method
的rules-option指定

https://stackoverflow.com/a/14380401/749227还有一些有用的信息。

我更喜欢在课堂上使用'required'属性。我没有发现这种原生属性支持它直接在文档中引用，但是因为看起来屏幕阅读器会发现它比class =“required”更有用，所以在这种情况下我会使用它。

顺便说一下，我很想看看插件是否尊重其他原生属性。以及关于哪些被ADT选中的信息。

Answer 3

回答您的具体问题：

“你如何使用带标签属性”

的“max（value）”方法

<input id="mytext" name="mytext" max="2"/>

“你如何使用”max（value）“方法和... CSS类”

您无法执行此操作，请使用其他一种方法来设置规则。

Answer 4

你可以使用data-rule-required属性，请不要使用jquery.metadata.js，我在jQuery Validation Plugin 1.11.1中测试

声明jQuery验证插件规则 - 属性与类和代码

4 个答案: