我使用内置的HTML验证方法来验证表单中的出生日期。
该表单有三个选择列表元素:
- 用户出生日期
- 用户出生日期月份
- 用户出生年份
由于用户必须选择有效选项,因此所有三个元素均被设置为确认“必需”。
在用户填写完所有三个选项之后,HTML验证至少选择一个选项就可以了。但是我想检查闰年的日期,并确保用户没有选择类似于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;
});
有几个问题
- 自定义消息不显示时,提交被点击。它会如果按钮被点击两次。第一次点击它可能设置消息,但不显示,第二次点击错误显示
- 如果在错误的选择和显示自定义消息之后,如果日期是固定的,并且我们尝试提交表单,它仍然会抛出错误。
1条答案
按热度按时间mqkwyuun1#
您不应该在提交表单时这样做,因为一旦设置了
setCustomValidity
值,它将不允许提交表单,除非验证错误值得到清除,而在您的代码中,问题是您在提交时清除了错误值,因此即使您在下次运行时更正了该值,您也会得到验证错误。有关详细信息,请查看此链接**CURRENT IMPLEMENTATION ISSUES AND LIMITATIONS(specially Problem 3)**
好的,现在你可以这样做..通过检查&设置下拉值更改事件的错误消息
我检查了这个&它工作得很好。
因此,现在当用户选择错误组合并按提交按钮时,将显示错误消息。
在http://jsbin.com/aqicim/1上尝试此操作