Question

我有一个测验，我需要在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'
            }
                      }
    });
}

Answer 1

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

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

这就是你需要做的......

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

要匹配其他字段的值，只需使用the equalTo rule即可。在使用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.
});

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

Answer 2

查看equalTo方法。

$('#myQuiz').validate({
  ...
  rules: {
    ...
    'entry[confirm_email]': {
      equalTo: "entry[email]"
    }
  }
});

JQuery验证 - 确认电子邮件表单验证

2 个答案: