有很多方法可以解决这个问题

添加novalidate到你的表单，但这是完全错误的，因为它将删除表单验证，这将导致用户输入错误的信息。

<表单操作=“....” class=“付款详细信息” 方法=“post” novalidate>

Use可以从必填字段中删除必填属性，这也是错误的，因为它将再次删除表单验证。 而不是这样:

<input class="form-control" id="id_line1" maxlength="255" name="line1" placeholder="第一行地址" type="text" required="required">

   Use this:

<input class="form-control" id="id_line1" maxlength="255" name="line1" placeholder="第一行地址" type="text">

当您不打算提交表单而不是执行其他选项时，Use可以禁用必填字段。这是我建议的解决方案。 如:

<input class="form-control" id="id_line1" maxlength="255" name="line1" placeholder="第一行地址" type="text" disabled="disabled">

或者通过javascript / jquery代码禁用它取决于你的场景。

我来这里是为了回答，我自己触发了这个问题，基于没有关闭</form>标签，并且在同一页面上有多个表单。第一个表单将扩展到包括对来自其他地方的表单输入进行验证。因为这些表单是隐藏的，所以它们触发了错误。

例如:

<form method="POST" name='register' action="#handler">


<input type="email" name="email"/>
<input type="text" name="message" />
<input type="date" name="date" />

<form method="POST" name='register' action="#register">
<input type="text" name="userId" />
<input type="password" name="password" />
<input type="password" name="confirm" />

</form>

触发器

name='userId'的无效表单控件不可聚焦。 name='password'的无效表单控件不可聚焦。 name='confirm'的无效表单控件不可聚焦。

前面的答案都不适合我，而且我没有任何具有必需属性的隐藏字段。

在我的例子中，问题是由于有一个<form>和一个<fieldset>作为它的第一个子元素，它包含了具有所需属性的<input>。删除<fieldset>解决了这个问题。或者你可以用它来包装你的表单;HTML5是允许的。

我使用的是Windows 7 x64, Chrome版本43.0.2357.130 m。

如果您在复选框输入上得到错误，则还有另一种可能性。如果您的复选框使用自定义CSS隐藏默认并替换为一些其他样式，这也将触发不可聚焦错误在Chrome验证错误。

我发现这在我的样式表:

input[type="checkbox"] {
    visibility: hidden;
}

简单的解决方法是用这个替换它:

input[type="checkbox"] {
    opacity: 0;
}

这是因为表单中有一个带有required属性的隐藏输入。

在我的情况下，我有一个选择框，它是隐藏的jquery tokenizer使用内联风格。如果我没有选择任何令牌，浏览器在表单提交时抛出上述错误。

所以，我用下面的css技术修复了它:

  select.download_tag{
     display: block !important;//because otherwise, its throwing error An invalid form control with name='download_tag[0][]' is not focusable.
    //So, instead set opacity
    opacity: 0;
    height: 0px;

 }

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

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

.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();
   }
});