对我来说，这发生了，当有一个<select>字段与预选选项的值“:

<select name="foo" required="required">
    <option value="" selected="selected">Select something</option>
    <option value="bar">Bar</option>
    <option value="baz">Baz</option>
</select>

不幸的是，它是占位符的唯一跨浏览器解决方案(我如何为“选择”框做一个占位符?)

Chrome 43.0.2357.124出现此问题。

<input type="submit" name="btnSave" value="Update" id="btnSave" formnovalidate="formnovalidate">

formnovalidate=“formnovalidate”

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

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

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

对于其他AngularJS 1。x个用户在那里，这个错误出现是因为我隐藏了一个窗体控件显示，而不是完全从DOM中删除它时，我不需要控件完成。

我通过在包含需要验证的表单控件的div上使用ng-if而不是ng-show/ng-hide来修复这个问题。

希望这能帮助到你的边缘情况用户。

另一个可能的原因，并没有涵盖在所有前面的答案，当你有一个正常的表单与必填字段，你提交了表单，然后隐藏它直接提交(javascript)没有时间验证功能的工作。

验证功能将尝试集中在必需的字段上并显示错误验证消息，但该字段已被隐藏，因此出现“name= " is not focusable."的无效表单控件!

编辑:

要处理这种情况，只需在提交处理程序中添加以下条件

submitHandler() {
    const form = document.body.querySelector('#formId');

    // Fix issue with html5 validation
    if (form.checkValidity && !form.checkValidity()) {
      return;
    }

    // Submit and hide form safely
  }

编辑:解释

假设在提交表单时隐藏表单，这段代码保证表单/字段在表单生效之前不会被隐藏。因此，如果一个字段无效，浏览器可以将焦点集中在它上，因为该字段仍然显示。

如果你有这样的代码，它会显示这条消息:

<form>
  <div style="display: none;">
    <input name="test" type="text" required/>
  </div>

  <input type="submit"/>
</form>