javascript - 表单验证插件因类而失败

Question

我正在使用我构建的验证器插件，随着每个问题的解决，似乎一个新的问题正在出现。当前的问题是，当我使用一个类作为验证选择器时，该类的任何内容都会被验证，并且只要填写其中一个即可被接受。现在，虽然这对于某些情况可能没问题，但并不适合所有情况。

fiddle

http://jsfiddle.net/9gwuyras/2/

验证插件的完整代码也可以在 fiddle 中找到。

我认为导致问题的代码部分

使用 Fiddle 作为代码行的引用 第 497 - 514 行

推理类选择器多次出现在setting.selectors[]数组中可能并不重要，但这是一个可能的选项:

for(var control in controls){
    if(typeof controls[control] != 'object'){
        console.log("controls."+control+" must be an object. Skipping this element");
        continue;
    }else if(typeof controls[control].validate == 'undefined'){
        console.log("controls."+control+".validate must be defined");
        continue;
    }
    $this.find('input, textarea, select').each(function(){
        if($(this).is('#'+control)){
            setControlData('#'+control, controls[control]);
            settings.selectors.push('#'+control);   
        }else if($(this).hasClass(control)){
            setControlData('.'+control, controls[control]);
            settings.selectors.push('.'+control);
        }
    });
}

行:397 到 401

原因是它可能只针对该类选择器的任何表单组，而不是焦点:

var formGroup = null;
if(type != "radio" && type != "checkbox"){
    formGroup = $(element).closest('.form-group');
    value = $(element).val();
}

这就是我到目前为止所拥有的。

编辑

我忘记了最重要的一点，插件是如何调用的:

$('#test').validator({
    controls : {
        name : {
            validate : "notEmpty"
        },
        dob : {
            validate : ['notEmpty', 'isDateTime'],
            dateFormat : 'm/d/Y'
        },
        gender : {
            validate : "notEmpty"
        }
    },
    bindInput : true,
    onSubmit : function(){}
});

controls 对象中的键可以是 ID 或类名。

Answer 1

据我所知，您正在尝试创建一个插件来验证表单上的 id 或类。

您说:

The currently problem is that when I use a class as the validation selector, anything with that class is validated and as long as one of them is filled in then it is accepted.

发生这种情况是因为一旦您的插件被触发，它就会“循环”(您的每个循环)通过与该类匹配的任何内容...即使该类中包装的元素仅填充一次(并且还有多个其他实例)它)。

您有很多选择，我的建议是:1)删除插件调用类的能力或2)通过检查类的状态来验证类。现在，当它应该仅验证基于状态(已检查、未检查、.val 等)的类时，它只会遍历并尝试验证所有内容。