奇怪的是，每个人都建议删除验证，而验证的存在是有原因的…… 不管怎样，如果你在使用一个自定义控件，并且想要维护验证，你可以这样做:

第一步。从输入中删除无显示，因此输入变得可聚焦

.input[required], .textarea[required] {
    display: inline-block !important;
    height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    z-index: -1 !important;
    position: absolute !important;
}

第二步骤。如果样式不够，则在特定情况下的输入上添加无效事件处理程序

inputEl.addEventListener('invalid', function(e){
   //if it's valid, cancel the event
   if(e.target.value) {
       e.preventDefault();
   }
}); 

对于Angular来说:

ng-required =“布尔”

如果值为true，这将只应用html5 'required'属性。

<input ng-model="myCtrl.item" ng-required="myCtrl.items > 0" />

我来说明一下我的情况，因为它不同于上面所有的解。我有一个html标签没有正确关闭。元素不是必需的，但它嵌入在一个隐藏的div中

在我的案例中，问题在于type="datetime-local"，出于某种原因，它在表单提交时被验证。

我改变了这个

<input type="datetime-local" />

到

<input type="text" />

当你向输入字段提供style="display: none;"和required属性时，这个问题就会发生，并且在提交时会进行验证。 例如:

<input type="text" name="name" id="name" style="display: none;" required>

这个问题可以通过从HTML的输入字段中删除所需的属性来解决。如果需要添加所需属性，请动态添加。如果你正在使用JQuery，请使用下面的代码:

$("input").prop('required',true);

如果需要动态删除该字段，

$("input").prop('required',false);

如果你不使用JQuery，你也可以使用纯Javascript:

document.getElementById('element_id').removeAttribute('required');

使用ElementInternals API的自定义元素元素不能使用delegatesFocus: true与shadowRoot，因为元素必须直接接收焦点(目前，这可能会发展)在公开的表单的DOM树(父表单可以在shadowRoot，它只是必须在同一部分的树与自定义和其他表单元素);元素必须是可见的，在我的实验中tabindex=0是必需的元素(-1似乎也工作)

一个从googlchrome扩展的带有自定义元素的演示在https://jimmont.github.io/samples/report-validity/

the error is simply reporting that an element which has attributes indicating it needs validation cannot receive focus when there's a problem with the validation, so the user can correct the error; if the error and information is coming in as expected you can ignore the error; otherwise it's likely the result of some UI features hiding elements and a mix of unexpected behavior; it's possible to use another approach in implementations to allow the user to walk back through a flow of some sort, but it appears that's beyond the scope of the question at the moment

如果您有任何具有required属性的字段，但在表单提交期间不可见，则将抛出此错误。当您试图隐藏该字段时，只需删除所需的属性。如果您想再次显示该字段，您可以添加所需的属性。通过这种方式，您的验证将不会受到影响，同时，错误将不会抛出。