Javascript HTML5 setCustomValidation解除绑定问题

我使用内置的HTML5验证方法来验证表单中的出生日期

表单有三个选择列表元素， 用户日期 用户月 用户年份

由于用户必须选择一个有效的选项，因此这三个元素都被作为“必需”进行验证

现在，在用户选择了所有三个选项并且HTML5验证至少选择了一个选项之后，我想检查闰年的日期，同时确保用户没有选择像1998年2月31日这样的东西

$('#form-signup-next').submit(function(){                       
   if($('#user_dob_month').val()=='2' && $('#user_dob_date').val()>29 ){
        var obj=$('#user_dob_date')[0];
        alert($('#user_dob_month').val());
        obj.setCustomValidity('Invalid Date!');         
   }else{
        var obj=$('#user_dob_date')[0];
        obj.setCustomValidity('');
    }
    return false;
    });

->单击提交时不显示自定义消息。如果该按钮被单击两次，则会发生这种情况。首先单击它，设置消息但不显示，然后单击显示错误

->如果在错误选择和显示自定义消息后，如果日期固定，并且我们尝试提交表单，它仍然会抛出错误：(

---

请在这方面帮助我。提前感谢：）

您不应该在提交表单时这样做，因为一旦设置了

setCustomValidity

值，它将不允许提交表单，除非验证错误值得到清除，并且在您的代码中，问题是您正在清除提交时的错误值。这就是为什么即使在下次运行时更正了值，也会出现验证错误的原因

有关详细信息，请查看此链接

好的，现在你可以这样做了。通过检查并设置下拉值更改事件的错误消息

$('#user_dob_date,#user_dob_month').on('change',function(){
    if($('#user_dob_month').val()=='2' && $('#user_dob_date').val()>29){
    $('#user_dob_date')[0].setCustomValidity('Invalid Date!');
    }
    else{
    $('#user_dob_date')[0].setCustomValidity('');
    }
  });

我检查了这个&它工作正常

因此，当用户选择错误的组合并按下submit按钮时，将显示错误消息

---

请在提交表单时尝试此操作，因为一旦设置了

setCustomValidity

值，它将不允许提交表单，除非验证错误值得到清除，并且在您的代码中，问题是您正在清除提交时的错误值。这就是为什么即使在下次运行时更正了值，也会出现验证错误的原因

有关详细信息，请查看此链接

好的，现在你可以这样做了。通过检查并设置下拉值更改事件的错误消息

$('#user_dob_date,#user_dob_month').on('change',function(){
    if($('#user_dob_month').val()=='2' && $('#user_dob_date').val()>29){
    $('#user_dob_date')[0].setCustomValidity('Invalid Date!');
    }
    else{
    $('#user_dob_date')[0].setCustomValidity('');
    }
  });

我检查了这个&它工作正常

因此，当用户选择错误的组合并按下submit按钮时，将显示错误消息

试试这个