在表单中添加novalidate属性将有助于:

<form name="myform" novalidate>

以防其他人有这个问题，我也经历过同样的事情。正如评论中所讨论的，这是由于浏览器试图验证隐藏字段。它在表单中寻找空字段并试图集中在它们上，但是因为它们被设置为display:none;，所以它不能。因此出现了错误。

我可以用类似的方法来解决这个问题:

$("body").on("submit", ".myForm", function(evt) {

    // Disable things that we don't want to validate.
    $(["input:hidden, textarea:hidden, select:hidden"]).attr("disabled", true);

    // If HTML5 Validation is available let it run. Otherwise prevent default.
    if (this.el.checkValidity && !this.el.checkValidity()) {
        // Re-enable things that we previously disabled.
        $(["input:hidden, textarea:hidden, select:hidden"]).attr("disabled", false);
        return true;
    }
    evt.preventDefault();

    // Re-enable things that we previously disabled.
    $(["input:hidden, textarea:hidden, select:hidden"]).attr("disabled", false);

    // Whatever other form processing stuff goes here.
});

此外，这可能是重复的“无效的窗体控件”只有在谷歌Chrome

这个错误发生在我身上，因为我提交了一个没有填写必填字段的表单。

产生此错误是因为浏览器试图集中在必填字段上，以警告用户这些字段是必填字段，但这些必填字段隐藏在一个display none div中，因此浏览器无法集中在它们上。我从一个可见的选项卡提交，所需的字段是在一个隐藏的选项卡，因此出现错误。

要解决这个问题，请确保您控制的必填字段已填满。

如果隐藏具有必填属性的输入元素，就会发生这种情况。

不使用display:none，你可以使用不透明度:0;

我还必须使用一些CSS规则(如position:absolute)来完美地定位我的元素。

我经常看到有人问这个问题，我自己也遇到过这个“错误”。甚至有链接质疑这是否是Chrome的一个真正的错误。 这是当一个或多个表单输入类型元素被隐藏并且这些元素具有最小/最大限制(或其他一些验证限制)时发生的响应。

在创建表单时，元素没有赋值，之后元素值可能会被填充或保持不变。 在提交时，表单将被解析，任何超出这些验证限制的隐藏元素将向控制台抛出这个“错误”，提交将失败。因为您不能访问这些元素(因为它们是隐藏的)，所以这是唯一有效的响应。

这不是一个实际的错误或错误。这表示有一些即将提交的元素值超出了一个或多个元素规定的限制。

为了解决这个问题，在表单提交之前的任何时候，为隐藏在表单中的任何元素分配一个有效的默认值，那么这些“错误”将永远不会发生。它本身并不是一个bug，它只是迫使您养成更好的编程习惯。

注意:如果您希望将这些值设置为验证限制之外的值，请使用form。addEventListener('submit'， myFunction)来拦截'submit'事件，并在"myFunction"中填充这些元素。似乎验证检查是在“myFunction()”被调用之前执行的。

我希望在这个冗长的答案种子中没有遗漏我的场景是一些非常奇怪的事情。

我有div元素，动态更新通过对话框被调用在他们加载和得到行动。

简而言之，div id有

<div id="name${instance.username}"/>

我有一个用户:测试帐户，出于某种原因，编码在java脚本世界中做了一些奇怪的事情。我收到了在其他地方工作的表单的错误消息。

缩小到这个范围，重新测试使用数字代替，即id似乎解决了这个问题。