jQuery 验证：需要有效的电话或有效的电子邮件

Question

jQuery 验证的第一天，但​​不是 jQuery 的第一天。很简单的问题：我有三个文本输入：姓名、电话和电子邮件。我想要求姓名（没有汗水）和电话或电子邮件，并确保输入在电话或电子邮件中有效。我试过这个：

$(document).ready(function() {
$("#contactForm").validate({
    debug:true,
    rules: {
        name: {
            required: true
        },
        email: {
            email:true,
            required: function(element){
                !$("#phone").valid();   
            }
        },
        phone: {
            phoneUS: true,
            required: function(element){
                !$("#email").valid();   
            }
        }
    },
    messages: {
        name: "Please specify your name",
        email: {
            required: "Please enter a valid email"
        },
        phone: "Please enter a 10 digit phone number"
    }
});

});

但它失败了，因为每个有效性检查都会调用另一个，无限递归并使浏览器崩溃。

必须有一些简单的方法来做到这一点，但我已经花了将近两个小时，它逃脱了我:(

Answer 1

好吧，超级简单的解决方案，忘记之前发布了 - 拦截表单提交，先手动验证，然后触发插件验证。这是一个需要选择 n 个复选框之一的示例（改编自实际项目，因此可能有一些拼写错误，但您明白了）：

(document).ready(function() {
       // on form submission
       $('form#signup').submit(function() {
                // make sure a checkbox is selected
                var checked = false;
                $('input.checkboxGroupMember').each(function(index) {
                    if ($(this).attr('checked')) {
                        checked = true;
                    }
                });
                if (checked == false) {
                    // do whatever to handle the failure here
                    $('div#feedback').html('Please select a checkbox');
                    return false;
                } else {
                    $('form#signup').validate();
                }

            });

            // once a checkbox is selected, clear feedback
            $('form input.checkboxGroupMember').change(function(index) {
                if ($(this).attr('checked')) {
                    $('div#feedback').empty();
                }
            });

            $('form#signup').validate();
        });

可以轻松地进行调整，以处理您不想通过 jQuery 验证插件进行的任何验证。