Question

我已经搜索了很多但仍然没有想出来......如何将各种错误消息传递给单个框（div），而不是在相关字段附近突出显示它们。比方说，我有4个必填字段，并为他们提供自定义消息：

<script>
// validation
(function($,W,D)
{
    var JQUERY4U = {};
    JQUERY4U.UTIL =
    {
        setupFormValidation: function()
        {
            //form validation rules
            $("#register-form").validate({
                validClass: "valid",
                errorContainer: $("#error-note"),
                errorLabelContainer: $([]),
                rules: {
                    name: "required",
                    email: {
                        required: true,
                        email: true
                    },
                    birthdate: "required",
                    eua: "required"
                },
                messages: {
                    name: "Name is required",
                    email: "Please, enter your email",
                    birthdate: "We need to know your date of birth",
                    eua: "Please check the checkbox..."
                },
                submitHandler: function(form) {
                    form.submit();
                }
            });
        }
    }
    //when the dom has loaded setup form validation rules
    $(D).ready(function($) {
        JQUERY4U.UTIL.setupFormValidation();
    });
})(jQuery, window, document);
</script>

#error-note是所有字段之前的div，我需要获取所有/任何错误消息输出（打印）。但现在错误消息在相关字段（我不需要）中“内置”。有没有办法实现它？

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Answer 1

为SO读者的利益发布了答案。

As per example code in the documentation这真的很简单，

$(document).ready(function () {

    $('#myform').validate({ 
        // rules and other options,
        errorLabelContainer: "#error-note",
        wrapper: "li"
    });

});

<div id="error-note"></div>也必须放在HTML布局中。

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

备注：

1）OP只是混淆了他的容器。 errorContainer:是第二个可选容器。 errorLabelContainer对于包含错误列表的单个框来说已经足够了。

2）这没有意义：errorLabelContainer: $([])。如果OP已经读过sample code in the docs，他就会看到他刚刚击败了他想要实现的目标。 $([])甚至不是有效的jQuery选择器。

3）这是不必要和多余的。

submitHandler: function(form) { form.submit(); }

As per docs，submitHandler回调函数会在验证后自动提交表单。无需在此处致电submit()。

4）As per docs，这是默认值，无需声明...

validClass: "valid"

5）包装这样的一切都是多余的，不必要的，冗长的，神秘的......

(function($,W,D) { var JQUERY4U = {}; JQUERY4U.UTIL = { setupFormValidation: function() { $("#register-form").validate({ .... }); } } $(D).ready(function($) { JQUERY4U.UTIL.setupFormValidation(); }); })(jQuery, window, document);

除了给寻求指导的人带来更多混淆之外，它没有用处。它来自一个流行但却很难解释的online demo/tutorial by Sam Deering，与许多地方有联系。 IMO，如果你要以jQuery / JavaScript专家的身份离开，至少要使用JavaScript中常见的代码格式，而不是PHP（Allman）使用的代码格式。无论选择何种代码格式样式，至少要始终如一地使用它。

与任何其他jQuery插件完全一样，只需将.validate()方法包装在DOM ready事件处理程序中就足以正确初始化此插件。

$(document).ready(function() { $("#register-form").validate({ // any rules, options and callbacks }) });

将jQuery验证错误消息传递给单个框（div）

1 个答案: