Question

我想显示相同的消息“请输入您的名字。”当用户按下提交时以及是否/何时发生了犯罪事件。

目前，当用户提交时，我会收到正确的消息。当我点击该字段，然后标签（焦点）我得到“这个字段是必需的”。我想以某种方式进入验证方法，因此消息是一致的。

这是我正在使用的标记：

HTML：

<input type="text" id="firstName" name="firstName" />

JavaScript的：

var messages = {
    'firstNameRequired': "Please enter your first name."
};


$('input[type="text"]').focusout(function(event) {
    $(this).valid();
});

....

function validateForm() {
    $('#myForm').validate({
        'rules': {
            'firstName': {
                'required': true,
                'minlength': 3
            }
        },
        'messages': {
            'firstName': messages.firstNameRequired
        }
        ...
});

// invalid but this is what I'm trying to accomplish:
 $('input[type="text"]').focusout(function(event) {
    $(this).valid({
        // override the default error message...
        'messages': {
            'firstname': messages.firstNameRequired
         }
    });
});

感谢您的时间！

Answer 1

我已从.validate()功能中删除了validateForm()方法。导致问题的原因是您误解了.validate()方法。每次需要验证时都会调用不 ...只在页面加载时调用一次来初始化表单上的插件。您正在查看其他消息，因为该插件未正确初始化。

您也不需要自定义外部focusout处理程序。您可以使用这样的内置onfocusout回调来实现相同的目标......

onfocusout: function(element) {
    this.element(element); //< inside 'validate()' method, this is like 'valid()'
},

这样做......

$(document).ready(function () {

    var messages = {
        'firstNameRequired': "Please enter your first name."
    };

    $('#myForm').validate({
        rules: {
            firstName: {
                required: true,
                minlength: 3
            }
        },
        messages: {
            firstName: messages.firstNameRequired
        },
        onfocusout: function(element) {
            this.element(element);
        },
        submitHandler: function(form) {
            alert('form is valid');
            return false;
        }
    });

});

DEMO：http://jsfiddle.net/JBL48/

使用focusout设置自定义验证器消息

1 个答案: