Question

我正在使用＆＃39; jQuery Validate＆＃39;在[月]，[日]和[年]的3个单独字段中接受出生日期作为输入的表格上的插件。如果他/她的年龄小于21岁，我需要将用户重定向到另一个网址。我已经在互联网上寻找可能的解决方案，然后决定使用＆＃39; submitHandler＆＃39;插件的方法。

添加submitHandler方法和我的自定义方法后的新问题是它已停止验证其他日期范围。虽然当计算年龄小于21时，它可以完美地重定向用户。

我的代码如下：

$.validator.addMethod("ageGateValidBirthdate", function (value, element) {
    var month = parseInt($('.age-gate-month').val(), 10);
    var day = parseInt($('.age-gate-day').val(), 10);
    var year = parseInt($('.age-gate-year').val(), 10);
    var userdate = new Date(year, month - 1, day);
    var CurrentDate = new Date();
    var flag = null;
    var validDate = false;
    var userDateInSeconds = userdate.getTime();
    var currentDateCompareVar = new Date();
    currentDateCompareVar.setTime(userDateInSeconds);
    if (CurrentDate > userdate && currentDateCompareVar.getFullYear() === year && currentDateCompareVar.getMonth() + 1 === month && currentDateCompareVar.getDate() === day) {
        validDate = true;
    }
    if (validDate && year > 1900) {
        flag = true;
        $('.age-gate-month, .age-gate-day, .age-gate-year').removeClass('error');
    }
    else {
        flag = false;
    }
    return flag;

}, "Enter correct birthdate");

$ageGatePage.on('submit', function (e) {
    e.preventDefault();
    jQuery.validator.addClassRules({
        "age-gate-month": {
            required: true,
            number: true,
            minlength: 1,
            maxlength: 2,
            range: [1, 12],
            ageGateValidBirthdate: true
        },
        "age-gate-day": {
            required: true,
            number: true,
            minlength: 1,
            maxlength: 2,
            range: [1, 31],
            ageGateValidBirthdate: true
        },
        "age-gate-year": {
            required: true,
            number: true,
            minlength: 4,
            maxlength: 4
        }
    });
    $ageGatePage.valid();
});

$ageGatePage.validate({
    groups: {
        dob: "month_of_birth day_of_birth year_of_birth"
    },
    messages: {
        //messages here
    },
    errorPlacement: function (error, element) {
        error.appendTo(element.parents(".age-gate-birth-date"));
    },
    submitHandler: function (form) {
        var month = parseInt($('.age-gate-month').val(), 10); // Convert to numbers with "+" prefix
        var day = parseInt($('.age-gate-day').val(), 10);
        var year = parseInt($('.age-gate-year').val(), 10);
        if (!(month > 0 && month < 13 && year > 0 && year < 32768 && day > 0 && day <= (new Date(year, month, 0))))
            return false;
        var userdate = new Date(year, month - 1, day); // Use the proper constructor
        var CurrentDate = new Date();
        var flag = null;
        var age = Math.floor((CurrentDate - userdate) / (365.25 * 24 * 60 * 60 * 1000));
        var ageGateFlag = age >= 21 ? true : false;
        if (ageGateFlag) {
            flag = true;
            form.submit();
        }
        else {
            flag = false;
            window.location.href = "http://domain.com/";
            return flag;
        }
        return flag;
    }
});

Answer 1

我刚刚得到了这个问题，在此发布以供进一步参考。这是在提交混乱的submitHandler中的天验证。以下列方式更改代码就可以了。

if (!(month > 0 && month < 13 && year > 0 && year < 32768 && day > 0 && day <= (new Date(year, month, 0))))
   return false;

到

if (!(month > 0 && month < 13 && year > 0 && year < 32768 && day > 0 && day <= 31))
   return false;

尝试使用invalidHandler进行一些解决方法但没有运气。如果有人可以发布更好的答案，那就非常明显了。

jQuery validate plugin：如果任何特定条件失效，则重定向用户

1 个答案: