jQuery验证-确认电子邮件表单验证 [英] JQuery Validate - Confirm email form validation

问题描述

我有一个测验，我需要在confirm email address字段中添加一些验证，基本上它只需要匹配以上字段中给出的电子邮件地址即可.我正在使用以下javascript，我可以在此处添加一些内容以确保电子邮件匹配吗?

if ($('#mtQuiz').length > 0) {
    $('#myQuiz').validate({
        errorElement: "em",
        errorContainer: $("#warning"),
        rules: {
            'entry[first_name]':            'required',
            'entry[last_name]':     'required',
            'entry[email]': {
                required: true,
                email: true
            },
            'entry[confirm_email]': {
                required: true,
                email: true
            }
        },
        messages: {
            'entry[first_name]':    'Please enter first name',
            'entry[last_name]': 'Please enter last name',
            'entry[email]': {
                required: ' Please enter a valid email address',
                minlength: 'Not a valid email address'
            },
            'entry[confirm_email]': {
                required: ' Please make sure email matches above',
                minlength: 'Does not match above email address'
            }
                      }
    });
}

解决方案

if ($('#mtQuiz').length > 0) { // <- unnecessary and superfluous
    $('#myQuiz').validate({
        // options, etc.
    });
}

您使用的是jQuery，因此无需使用if ($('#mtQuiz').length > 0)检查#myQuiz的存在.如果#myQuiz元素不存在，jQuery将简单地忽略它而不会出现任何错误.

这就是您需要做的...

$('#myQuiz').validate({  // initialize the plugin
    // options, etc.
});

---

要匹配另一个字段的值，只需使用 equalTo规则.使用equalTo规则时，无需重复其他任何规则，因为equalTo始终会强制该值匹配已遵循其规则的主字段的值.

$('#myQuiz').validate({
    // options, etc.,
    rules: {
        'entry[first_name]': 'required',
        'entry[last_name]': 'required',
        'entry[email]': {
            required: true,
            email: true
        },
        'entry[confirm_email]': {
            //required: true,  // <- redundant, not needed with 'equalTo'
            //email: true      // <- redundant, not needed with 'equalTo'
            equalTo: '[name="entry[email]"]' // <- any valid jQuery selector
        }
    },
    // other options, etc.
});

演示: http://jsfiddle.net/JCY2E/

I have a quiz, and i need to add some validation to a confirm email address field, basically it just has to match the email address given in the above field. I am using the following javascript, can i add something in here which will make sure the emails match?

if ($('#mtQuiz').length > 0) {
    $('#myQuiz').validate({
        errorElement: "em",
        errorContainer: $("#warning"),
        rules: {
            'entry[first_name]':            'required',
            'entry[last_name]':     'required',
            'entry[email]': {
                required: true,
                email: true
            },
            'entry[confirm_email]': {
                required: true,
                email: true
            }
        },
        messages: {
            'entry[first_name]':    'Please enter first name',
            'entry[last_name]': 'Please enter last name',
            'entry[email]': {
                required: ' Please enter a valid email address',
                minlength: 'Not a valid email address'
            },
            'entry[confirm_email]': {
                required: ' Please make sure email matches above',
                minlength: 'Does not match above email address'
            }
                      }
    });
}

解决方案

if ($('#mtQuiz').length > 0) { // <- unnecessary and superfluous
    $('#myQuiz').validate({
        // options, etc.
    });
}

You're using jQuery so you don't need to check for the existence of #myQuiz with if ($('#mtQuiz').length > 0). If the #myQuiz element doesn't exist, jQuery will simply ignore it without any errors.

This is all you need to do...

$('#myQuiz').validate({  // initialize the plugin
    // options, etc.
});

---

To match the value of another field, simply use the equalTo rule. While using the equalTo rule, there is no need to duplicate any of the other rules since equalTo will always force the value to match the primary field's value which already followed its rules.

$('#myQuiz').validate({
    // options, etc.,
    rules: {
        'entry[first_name]': 'required',
        'entry[last_name]': 'required',
        'entry[email]': {
            required: true,
            email: true
        },
        'entry[confirm_email]': {
            //required: true,  // <- redundant, not needed with 'equalTo'
            //email: true      // <- redundant, not needed with 'equalTo'
            equalTo: '[name="entry[email]"]' // <- any valid jQuery selector
        }
    },
    // other options, etc.
});

DEMO: http://jsfiddle.net/JCY2E/

这篇关于jQuery验证-确认电子邮件表单验证的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！