setCustomValidity 的自定义错误避免提交表单答案

【问题标题】：Custom error with setCustomValidity avoid submitting the formsetCustomValidity 的自定义错误避免提交表单
【发布时间】：2017-05-17 15:20:13
【问题描述】：

我在自定义表单上显示的错误时遇到问题。这是有问题的代码：

<html>
<body>
    <form action="/done.html">
        <input type="text" id="query" name="query" 
               required 
               oninvalid="this.setCustomValidity('What ?')">
        <input type="submit">
    </form>
</body>
</html>

如果我在输入中输入一些内容，则表单会毫无问题地提交。但是如果我只是按提交，那么即使输入已满也不可能再次提交！

我必须添加onkeypress="this.setCustomValidity('')"。

为什么setCustomValidity 一段时间后没有自动清理？有没有其他没有大量 js 的解决方案？

【问题讨论】：

标签： javascript html css forms

【解决方案1】：

我知道您的问题是，当您提交没有数据的表单时，它会停止工作，而起作用的是使用空字符串执行 setCustomValidity 函数。

基于此，解决方案可能是在您的表单上添加onsubmit="setCustomValidity('')"，以便在您每次提交表单时重新启动。

我不能肯定地告诉你，因为我不知道那个函数 setCustomValidity 在做什么。因此，请尝试让我知道它是否有效。

【讨论】：

使用onsubmit 与onkeypress 相同。 setCustomValidity 是使用必需属性as defined in HTML Standard 指定错误的解决方案@