所以我有一个表单,但我还不需要将信息提交给服务器……我需要的是通过
HTML5内置验证条件(例如电子邮件等)运行字段. ),如果是真的,只需执行一个特定的功能……
到目前为止,我已经想到了……
function checkform() { var /* all the elements in the form here */ if (inputElement.validity.valid == 'false') { /* Submit the form,this will cause a validation error,and HTML5 will save the day... */ } else { navigateNextStep(); } }
这是我到目前为止所提出的逻辑,而且有点后悔,因为我提交知道有一个无效值,因此触发验证提示……
我对上述逻辑的唯一问题是,我有大约7-8个输入元素,并且我发现执行以下操作的选项,而不是’脏’:
var inputs = document.getElementsByTagName("INPUT"); if (!inputs[0].validity.valid && !inputs[1].validity.valid && ...)
想法?
解决方法
你可以调用formEl.checkValidity()…这将返回一个布尔值,指示整个表单是否有效,否则抛出适当的无效事件.
不过,我不确定你是如何期望提交表单来触发浏览器的验证用户界面的.无论验证状态如何,调用formEl.submit()似乎都会导致提交.这在The H5F project page的底部注明,其中说:
Safari 5,Chrome 4-6 and Opera 9.6+ all block form submission until all form control validation
constraints are met.Opera 9.6+ upon form submission will focus to the first invalid field
and bring up a UI block indicating
that it is invalid.Safari 5.0.1,and Chrome 7 have removed form submission blocking if a form is invalid,most likely due to legacy forms now not submitting on older sites.