验证插件 - 自动验证页面上的多个表单答案

【问题标题】：Validation plugin - Auto validate multiple forms on a page验证插件 - 自动验证页面上的多个表单
【发布时间】：2013-10-06 12:44:34
【问题描述】：

目前我需要像这样验证每个表单：

    $(document).ready(function () {
        $('#admin_settings_general').validate({
            rules: {
                admin_settings_application_title: {
                    required: true
                }
            },
            highlight: function (element) {
                $(element).closest('.form-group').addClass('has-error');
            },
            unhighlight: function (element) {
                $(element).closest('.form-group').removeClass('has-error');
            }
        });
    });

我希望它自动验证带有 required 标签的每个元素的表单。

我该怎么做？

【问题讨论】：

“要求代码的问题必须表明对正在解决的问题有最低限度的了解。包括尝试的解决方案、为什么它们不起作用以及预期的结果。另见：Stack Overflow question checklist。”
“自动”是什么意思？ Validate 插件已经自动验证具有required 属性的每个元素。如果你的意思是不必调用.validate()，你就不能……这就是插件的初始化方法。它还应该如何知道要验证的表单以及要使用的选项？
嗯，我的意思是我必须为当前的每个表格致电$('#admin_settings_general').validate()。如何在不限制为一种形式的情况下调用它？
你试过什么？
$.validate() 但它不会验证表单。

标签： jquery jquery-validate

【解决方案1】：

引用 OP：

“我希望它自动验证带有所需标签的每个元素的表单。”

引用 OP 评论：

“我目前必须为每个表单调用$('#admin_settings_general').validate()。我怎样才能调用它而不将其限制为一个表单？”

要正确初始化页面上所有表单上的.validate()，请使用通用选择器，例如form标签本身（或class）。由于您不能将.validate() 附加到表示多个form 元素的任何 jQuery 选择器，因此请使用jQuery .each()。这就是插件方法的设计方式。

$(document).ready(function() {

    $('form').each(function() {  // attach to all form elements on page
        $(this).validate({       // initialize plugin on each form
            // global options for plugin
        });
    });

});

工作演示：http://jsfiddle.net/6Fs9y/

【讨论】：

@Michael，修正了错字并添加了演示。不客气。
是的，这对我有用。请注意，您需要each 电话。在$("form") 上调用validate() 是不够的；您需要在 form 的每个实例上单独调用 validate()。
jsfiddle.net/prashantptapase/6Fs9y/86 为什么这种方法有效。多重选择器........？
@PrashantTapase，您不应将新问题发布为 cmets。但是，您不能将.validate() 方法附加到表示多个表单的任何 jQuery 选择器，因为这正是开发人员设计他的插件的方式。使用.each()，如我的回答中所述：jsfiddle.net/6Fs9y/87
@Sparky 是的，我的评论是为了确认你的回答