如何在 HTML 表单中自定义验证消息？

HTML 表单的自定义验证消息

在 HTML 表单中，当 REQUIRED 字段留空时，通常会出现一条默认消息：“请填写此字段。”可以对其进行自定义，以提供更具体且用户友好的错误消息。

更改默认错误消息

要更改默认错误消息，请使用 setCustomValidity()方法。例如，要将 id 为“username”的输入字段的错误消息设置为“此字段不能留空”，请添加以下代码：

<input type="text">

隐藏错误消息

用户在字段中输入数据后，错误消息应该被隐藏。这可以通过使用 oninput 事件处理程序将错误消息设置为“”来完成：

oninput="this.setCustomValidity('')"

注意： 内联事件处理程序不需要“this”关键字，但可以使用用于保持一致性。

示例

以下代码演示了使用offsetCustomValidity()提供自定义错误消息并在用户输入新数据时隐藏它：

<form>

以上是如何在 HTML 表单中自定义验证消息？的详细内容。更多信息请关注PHP中文网其他相关文章！