jQuery的验证插件添加即使

Question

我使用的jQuery Validation Plugin不需要仍在运行的方法和我加入我自己的方法，像这样：

jQuery.validator.addMethod("num", function(num) { 
    if(isNaN(num)) 
     return false; 

    return true; 
}, "Please enter a valid number"); 

然而，即使我没有在required类添加到一个表单元素，如果用户没有输入任何内容，这个验证方法仍然会被调用并计算为false。但我想这样做的行为是，如果一个元素没有required类，只有在用户输入了某个元素时才会调用它。无论如何要做到这一点？谢谢！

UPDATE

所以我上面贴实际的代码本来是一个简单的例子来说明这个问题，但是现在我忍受那是给我问题的具体例子。这里是的jsfiddle链接：

http://jsfiddle.net/SVwmH/2/

的HTML

<form method="post"> 
    <li> 
     <label for="2">Mileage</label> 
     <input type="text" name="2" id="attr_2" class="non_neg_int" 
     value="" /> 
    </li> 
    <li> 
     <label for="3">VIN (Vehicle Identification Number)</label> 
     <input type="text" name="3" 
     id="attr_3" class="vin" maxlength="17" value="" /> 
    </li> 
    <li> 
     <input type="submit" /> 
    </li> 
</form> 

的JS

$(document).ready(function() { 
    var validator = $("form").validate({ 
     onkeyup: false, 
     onblur: true, 
     ignore: "", 
     submitHandler: function (form) { // for demo 
      alert('valid form submitted'); // for demo 
      return false; // for demo 
     } 
    }); 
}); 

jQuery.validator.addMethod("vin", function (vin) { 
    if (!(/^[A-HJ-NP-Z0-9]{17}$/.test(vin))) return false; 
    return true; 
}, "Must be a valid VIN"); 

jQuery.validator.addMethod("non_neg_int", function (non_neg_int) { 
    if (isNaN(non_neg_int) || non_neg_int == null || non_neg_int == "" || non_neg_int < 0 || !is_int(non_neg_int)) return false; 

    return true; 
}, "Must be a nonnegative integer"); 

function is_int(value) { 
    if ((parseFloat(value) == parseInt(value)) && !isNaN(value)) { 
     return true; 
    } else { 
     return false; 
    } 
} 

Answer 1

报价OP：

“不过，就算我不是required类添加到表单元素，这 验证方法仍然会被调用，并评估为假，如果 用户输入什么都没有。”

我无法重现您描述的问题。

发布时，空字段不会调用您的自定义方法，也不需要字段。

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

HTML：

<form id="myform"> 
    <input type="text" name="field1" /> 
    <input type="submit" /> 
</form> 

jQuery的：

$(document).ready(function() { 

    jQuery.validator.addMethod("num", function (num) { 
     if (isNaN(num)) return false; 
     return true; 
    }, "Please enter a valid number"); 

    $('#myform').validate({ // initialize the plugin 
     rules: { 
      field1: { 
       num: true 
      } 
     } 
    }); 

}); 

---

编辑基于编辑OP：

我发现您的代码有以下问题。只有其中一些项目打破了你的代码。其余的只是一个很好的做法。您可以一次测试这些，亲自查看。

1）没有名为onblur这样的选项。有一个名为onfocusout，默认启用。如果你通过true这个，你会打破它。你只能通过false来禁用它，或者传递一个自定义函数来覆盖它。要保持启用默认onfocusout选项，请将其完全保留。

2）每个输入元素必须有一个有效的name和name="2"是无效的。它不能以数字开头。

3）如果你想验证任何隐藏字段，该ignore选项必须设置为ignore: []，而不是ignore: ""。否则，请不要选择此选项，默认情况下会忽略隐藏的字段。参见：https://stackoverflow.com/a/8565769/594235

4）我不明白在每个元素上指定value=""这一点。如果您不使用它，只需省略value属性即可。

5）而是写出了这一切......

if (test) return false; 
return true; 

...你能更简单地写一个短线：return !(test);（我只是增加了!翻转您的特定test逻辑return false，就像你写的。）

6）As per documentation，你只有通过value，element以及可选的params，如下所示：.addMethod("myrule", function(value, element, params) { ... }, "message")。

该语法减轻了混淆。此外，使用规则的名称"non_neg_int"代替"value"这个词完全违反了您的non_neg_int自定义方法。

如果您不希望这些规则是“必需的”，那么您必须修复规则中的逻辑。例如，non_neg_int方法正在查找空字段或空字段，因此当字段为空时它当然会给出错误消息。

关于这两条规则，我只是增加了this.optional(element)，这使得规则可选。换句话说，如果你把它留空，这条规则什么都不会做。

return this.optional(element) || !(test); 

下面有一个工作演示，你可以调整，因为你认为合适。

新演示：http://jsfiddle.net/gVVa8/