validation分解日期宽度jQuery Validation插件

jQuery Validation插件用于validation所有表单数据: http : //docs.jquery.com/Plugins/Validation

出生日期有3个选择字段:日,月,年。

第一:如何确保用户选择所有3个字段,并且仅当未选择所有三个字段中的一个时才显示“无效”图标。 例如,现在我有3个选择字段,但是当我选择第一个并且没关系时,即使未选择其他两个选择字段(月,年),插件也会显示“确定”图标。

第二:如何validation这3个选择字段并确保在这3个​​选择字段中选择出生日期的人是否超过18年?

 DD // day options   MM // month options   YYYY // year options  

另外我设置了’错误’图标不是在每一个之后显示,而是在所有这些之后显示:

 groups:{ date_of_birth:"DOBd DOBm DOBy" }, errorPlacement:function(error,element){ if (element.attr("name") == "DOBd" || element.attr("name") == "DOBm" || element.attr("name") == "DOBy") error.appendTo(element.parent("td").next("td")); else error.appendTo(element.parent("td").next("td")); }, 

您可以使用$.validator.addMethod添加自定义方法

添加两个方法:一个用于检查所有3个选项( FullDate ),另一个用于检查年龄( Age )。 由于3个元素是分组的,我只将一个方法放在一个选择器上,另一个放在另一个选择器上。

此外,您的errorPlacement函数有一个if/else ,它完全相同,这是不必要的。

 $(function() { // this function requires month day and year selections $.validator.addMethod("FullDate", function() { //if all values are selected if($("#DOBd").val() != "" && $("#DOBm").val() != "" && $("#DOBy").val() != "") { return true; } else { return false; } }, 'Please select a day, month, and year'); // this function checks the selected date, returning true if older than 18 years $.validator.addMethod("Age", function() { //only compare date if all items have a value if($("#DOBd").val() != "" && $("#DOBm").val() != "" && $("#DOBy").val() != "") { //get selected date var DOB = new Date($("#DOBy").val(), $("#DOBm").val(), $("#DOBd").val()); var eday = new Date(); //get today eday.setFullYear(eday.getFullYear() - 18); //set to eighteen years ago //if older than 18 if(DOB < eday) { return true; } else { return false; } } return true; }, 'Must be 18'); $("form").validate({ rules: { DOBd: "FullDate", DOBm: "Age" }, groups:{ date_of_birth:"DOBd DOBm DOBy" }, errorPlacement:function(error,element){ error.appendTo(element.parent("td").next("td")); } }); });