显示自定义错误消息后，oninvalid setCustomValidity字段将不会生效

当在表单中使用HTML5的表单验证时，可以使用oninvalid和setCustomValidity来显示自定义的错误消息。但是，如果在设置了自定义错误消息后，再使用oninvalid来修改setCustomValidity字段，那么自定义错误消息将不会生效。

这是因为oninvalid事件在验证失败时触发，并且浏览器会检查setCustomValidity字段的值来确定错误消息的内容。如果在oninvalid事件中修改了setCustomValidity字段的值，浏览器会重新计算错误消息，并且会忽略之前设置的自定义错误消息。

解决这个问题的方法是，在修改setCustomValidity字段之前先检查其值是否为空。只有当setCustomValidity字段为空时，才可以设置自定义的错误消息。以下是一个示例代码：

<form>
  <input type="text" id="name" required oninvalid="checkValidity()">
  <button type="submit">Submit</button>
</form>

<script>
function checkValidity() {
  var input = document.getElementById("name");
  if (input.setCustomValidity === "") {
    input.setCustomValidity("Please enter a valid name.");
  }
}
</script>

在上面的示例中，当用户提交表单且名称字段为空时，浏览器会显示默认的错误消息。然后，在oninvalid事件中，会检查setCustomValidity字段的值是否为空。如果是空的，就会设置自定义的错误消息。

这样，即使之前设置了自定义错误消息，也会被覆盖掉，确保显示的是最新的错误消息。

在腾讯云的产品中，与表单验证相关的服务有腾讯云API网关。它是一种全托管的API网关，可以轻松构建、部署、运营和扩展API，同时提供了丰富的监控和日志功能。您可以通过以下链接了解更多信息：

腾讯云API网关：https://cloud.tencent.com/product/apigateway