jQuery 验证优雅的条件逻辑

Question

我正在使用 jQuery 验证插件验证表单(需要使用该插件，因为我有其他功能需要该插件)。它有以下字段:

电话号码 名字 姓氏 城市 zip

当以下陈述之一为真时，该表单被视为有效:

• 电话号码有效
• firstName lastName city 均有效
• firstName lastName zip 均有效

我知道如何要求每个字段并使用其他验证方法(我什至有自己的 zip 验证方法)，但我正在尝试找出一个优雅的解决方案来实现我上面描述的逻辑。自定义方法或验证组是处理此问题的最佳方法吗？

Answer 1

情人眼里出西施……

我建议创建一个自定义验证器来处理您遇到的三种情况。

我花了一段时间来了解验证可以做什么...我想出了这个来验证我的表单。我使用了对 servlet 的异步调用来检查我的用户名...但您可以在其中放入您想要的任何内容。

我发现了另一篇关于堆栈溢出的文章，它更好地说明了如何制作自定义验证器...... 我特别喜欢这行 jQuery.validator.methods['date'].call(this,value,element) 因为您似乎可以在自定义代码中使用内置验证器。 jQuery Validate Plugin - How to create a simple custom rule?

这些是我在学习验证时使用的资源: http://www.ferdychristant.com/blog//articles/DOMM-7LZJN7//详细介绍如何真正使用验证的文章。 http://www.ferdychristant.com/blog//pages/jQuery%20validation%20code
http://randomactsofcoding.blogspot.com/2008/10/starting-with-jquery-how-to-write.html
http://docs.jquery.com/Plugins/Validation/Methods/required#dependency-expression

http://docs.jquery.com/Plugins/Validation 中蕴含的信息深度惊人。 ...您只需点击全部即可!

在下面您还会看到，您可以将 javascript 直接放入规则部分。

$(document).ready(function() {

$("#EmailUserEditFormId").validate({

    debug: true, //this lets it hit firebug
    onkeyup:false, //keep the traffic down for my async call

    rules: {

        username: {
            required: (jQuery('input#username:disabled').length==1)?false:true, //example of JS in a rule
            usernameCheck: (jQuery('input#username:disabled').length==1)?false:true //example of a JS rule with a custom validator 
        }
    },

    messages: {
        username: {
            required: "Please enter a unique username.",
            usernameCheck: "Username is already in use. Choose another."
        }
    }

});

});

...这是我的简单自定义验证器。

jQuery.validator.addMethod('usernameCheck', function(username) {
var postURL = "CheckUsername";
$.ajax({
    cache: false,
    async: false,
    type: 'POST',
    data: 'username=' + username,
    datatype: 'xml',
    url: postURL,
    success: function(xml) {
        unique = (jQuery(xml).find('unique').text() == "true") ? true : false;
    }
});
return unique;

}, '');