如何捕捉Chrome字段验证错误事件

How to catch Chrome field validation error event

本文关键字：错误 事件 验证 字段 何捕捉 Chrome      更新时间：2023-09-26

我使用HTML5表单字段类型为'email'。Chrome将在提交时验证该字段的值，并在出现错误时以工具提示的方式通知用户。
同时，我附加了一个JS插件到提交按钮，在提交时禁用它，并将文本更改为"登录…"。

如何在验证警报/错误的情况下捕获事件?
我需要这样才能再次启用Submit按钮。


亲切的问候,巴特

编辑:


所以我找到了一种方法来禁用验证:stackoverflow.com/questions/3090369/…但问题仍然存在:是否有一种方法来捕获事件?

可以监听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);

在JSFiddle上演示

相关文章：