如何在HTML5验证之前捕捉提交?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (49)

有什么方法可以submit在HTML5验证步骤之前捕捉表单的动作?

HTML

<form method='post' >
    <fieldset>
        <input type='email' name='foo' required />
        <input type='submit' />
    </fieldset>
</form>

jQuery的

$('form').submit(function() {
    $('fieldset').addStyle('error');
    return false;
})

但是submit只有在HTML5验证通过后才会触发。

提问于
用户回答回答于

不,HTML5验证发生在任何提交事件之前,在所有浏览器中,所以这是不可能的,除了改变事件类型,就像点击按钮:

$('input[type="submit"]').on('click', function() {
    $('fieldset').addClass('error');
});
用户回答回答于

当页面首次加载时,使用jquery禁用表单上的验证,以防止在onsubmit处理程序运行之前发生任何验证:

$(document).ready(function(){
   $('form').attr('novalidate','novalidate');
})

然后在onsubmit函数结束时,通过javascript(使用checkValidity())手动在每个字段上运行HTML5验证

扫码关注云+社区

领取腾讯云代金券