禁用不在表单中的HTML5元素的验证

Question

一个表单具有禁用验证的可能性。

<form novalidate/>

现在，我有一个不在表单中的HTML5元素。在这种情况下如何禁用验证？

<noform>
    <input name="email" type="email"/>
</noform>

- Niels Steenbeek

---

这可能会有所帮助：https://dev59.com/D3A75IYBdhLWcg3w0cnx#3092801 - Dunhamzzz

Firefox 在输入更改时进行验证。不幸的是，此时不触发“无效”事件。 - Niels Steenbeek

Answer 1

你想要实现什么并不明确。如果input元素不能提交到服务器，则不会触发验证过程，正如你的评论所指出的那样。然而，单个input元素仍然可能处于无效状态。有几种简单的解决方案可以避免这种情况：

• 如果您不希望将字段的有效性状态评估为电子邮件，请勿使用type =“email”
• 如果您需要它是email类型，但不关心它是否为有效电子邮件（例如，触发移动设备上特定键盘模式），则使用CSS隐藏指示。

以下是如何隐藏常规Firefox红色光晕：

input:-moz-ui-invalid {
    box-shadow: none;
}

这里是一个快速的例子链接

- robertc

---

优秀的答案！ 有一点：您的解决方案仍将显示验证消息。 我必须在输入上执行setCustomValidity(' ');。也许您可以更新您的示例以获得最终解决方案。 - Niels Steenbeek