javascript - 如何捕获 Chrome 字段验证错误事件

Question

我使用 HTML5 表单字段类型“电子邮件”。 Chrome 将在提交时验证该字段的值，并在出现错误时通过工具提示消息直观地通知用户。
同时，我在提交按钮上附加了一个 JS 插件，该插件在提交时禁用它并将文本更改为“正在登录...”。

如果出现验证警报/错误，如何捕获事件？
我需要这个才能再次启用“提交”按钮。

亲切的问候，
巴特

编辑:
所以我找到了一种禁用验证的方法:stackoverflow.com/questions/3090369/…但问题仍然存在:有没有办法捕获事件？

Answer 1

您可以监听 invalid 事件或设置 oninvalid 属性。当您尝试提交表单但元素验证失败时，它将启动。

function listener(event) {
    event.preventDefault(); // prevent the browsers default behavior
    console.log(event); // log the generated event
}

var input = document.getElementById('number');
input.addEventListener('invalid', listener);

Demonstrated on JSFiddle