2

我正在使用 jQuery 官方网站上提供的 jQuery Validate Plugin 来验证我的表单。一切都很好，直到我必须通过规则，而不是基于 field name，而是基于classor id。我无法做到这一点。

这是我如何将规则传递给字段的示例name="comment"。

这是我的 jQuery 代码

$("#comForm").validate({
    rules: {
        comment: {
            required: true,
            minlength: 5,
            maxlength: 500
        }
    }
});

这是我的表格

  <form id="comForm" action="#" method="post" >
  <textarea rows="4" name="comment" placeholder="What do you think?" class="input-xxlarge" id="defaultform"></textarea></br>
  <textarea rows="4" name="othercomment" placeholder="What do you think?" class="input-xxlarge" id="defaultform"></textarea></br>
  <input type="submit" value="Rate!" class="btn btn-primary">
  </form>

假设我想将规则传递给使用默认表单的每个字段id或使用input-xxlarge class. 那可能吗？

4

3 回答 3

3

是的，这是可能的，但你真的不应该使用重复id的 's ......它是无效的 HTML，它会导致 JavaScript 问题。class如果您需要重复，请使用。

使用内置rules()方法添加规则并通过class. 请参阅文档。

然后使用 jQuery 的.each()方法将规则应用于所有使用相同class.

HTML：

<form id="myform">
    <textarea class="myclass" name="field1" ></textarea>
    <textarea class="myclass" name="field2" ></textarea>
</form>

jQuery：

$('#myform').validate({
    // your other rules and options
});

// the following method must come AFTER .validate()
$('.myclass').each(function() {
    $(this).rules('add', {
        required: true,
        minlength: 5,
        maxlength: 500,
        messages: {
            required: "Required input",
            minlength: "Must be at least {0} characters",
            maxlength: "Must be less than {0} characters"
        }
    });
});

工作演示

另外，类似于这个问题：

jQuery Validate set rule使用通配符查找目标字段

于 2013-01-24T04:21:09.063 回答
0

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

例子：

<input type="text" name="email" data-rule-required="true" data-rule-email="true">
<input type="text" name="password" id="passoword" data-rule-required="true" data-rule-minlength="6">
<input type="text" name="password-confirm" data-rule-required="true" data-rule-minlength="6" data-rule-equalsto="#password">

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

<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();
于 2013-03-30T11:07:21.687 回答
0

您可以使用标准 jquery 选择器向元素添加规则，如下所示：

$(".required").rules("add", { 
  required:true,  
  minlength:1
});
于 2013-01-24T04:17:00.057 回答