以 HTML5 输入验证的样式使用 Javascript 显示文本

Question

我有一个包含多个输入的表单。 我可以验证客户端的大部分输入，并且为此使用 HTML5 的输入验证。 不过，对于一个输入，我只能知道它是否是有效的服务器端。

在服务器说输入无效的情况下，如何为该输入显示与其他 HTML5 的输入验证消息样式相同的消息？

Answer 1

您可以使用 Ajax 请求将表单数据发送到服务器。 然后服务器验证数据并返回成功或无效。 然后使用 Javascript 您可以在返回无效时显示验证消息。

更新：这可以通过 Javascript 验证 API 来完成。 .setCustomValidity() 方法可以传递：一个空字符串。 这会将字段设置为有效，因此 .checkValidity() 和 .validity.valid 将返回 true，或包含将显示在消息气泡中的错误消息的字符串（如果使用）。 该消息还将该字段标记为失败，因此 .checkValidity() 和 .validity.valid 将返回 false 并且无效事件将被触发。

来源： http : //www.sitepoint.com/html5-forms-javascript-constraint-validation-api/