我也有同样的问题。经过一番挖掘，我发现它需要是一个input元素，类型为text。“可选隐藏”的意思是你可以用CSS隐藏它。
如果你只是添加一个名为email或username的input Chrome会给你另一个警告，说input元素应该有autocomplete属性。这就是我用来修复这些错误的方法：

<input
  type="text"
  name="email"
  value="..."
  autocomplete="username email"
  style="display: none;"
>

您需要手动将实际的用户名或电子邮件呈现到elements值属性中。
另外，请记住，内联样式不是一个很好的实践。

使用hidden属性而不是type="hidden"

<input hidden type="text" autocomplete="username" value="{{...}}">

我也遇到过同样的情况。一切似乎都很好，但我仍然得到了这个冗长。
在我的情况下，帮助我重新定位这个userName输入从表单的末尾到开始。
这是我修改之前的代码：

<form id="changePass">
    <div class='modal-dialog'>
       <input type="password" class="form-control" id = "changePasswordOldPassword" autocomplete="current-password"/>
       <input type="password" class="form-control" id = "changePasswordNewPassword" autocomplete="new-password"/>
       <input type="password" class="form-control" id = "changePasswordNewPassword2" autocomplete="new-password"/>

       <div class="modal-footer">
          <button type="button" id="change-password-ok-button">Ok</button>
          <button type ="button" data-dismiss="modal">Close</button>
       </div>
   </div>
   <input id="userName" name="username" autocomplete="username" value="">
</form>

这是当前代码：

<form id="changePass">
   <input id="userName" name="username" autocomplete="username" value="">
   <div class='modal-dialog'>
       <input type="password" class="form-control" id = "changePasswordOldPassword" autocomplete="current-password"/>
       <input type="password" class="form-control" id = "changePasswordNewPassword" autocomplete="new-password"/>
       <input type="password" class="form-control" id = "changePasswordNewPassword2" autocomplete="new-password"/>

       <div class="modal-footer">
          <button type="button" id="change-password-ok-button">Ok</button>
          <button type ="button" data-dismiss="modal">Close</button>
       </div>
   </div>
</form>

你必须把输入标签放在另一个标签中，例如：

<form action="">
<div>
  <input type="text" autocomplete="username">
</div>
<div>
  <input type="password" autocomplete="password">
</div>
<div>
  <input type="password" autocomplete="password">
</div>

我在VueJs中也遇到过同样的情况，当我使用渲染条件v-if v-else，我尝试将input标签放入new标签中，这对我来说很有效

虽然我知道这个问题已经很老了，但我想它可能对某些人有用。我在React应用程序更新用户密码时也遇到了同样的问题，这对我来说就在没有标签的密码字段上方。请原谅我以React的方式写作。

<input hidden type='text' name='email' autoComplete='email' />

基本用法：-

<form>
 <input hidden type='text' name='email' autoComplete='email' />
 <label htmlFor="oldPass">Enter your current password</label>
 <input id="oldPass" type="password" />
 <label htmlFor="newPass">Enter your new password</label>
 <input id="newPass" type="password" />
</form>

在阅读Jonas评论后，我重建了项目，警告消失了

我在控制台中显示了相同的警告，这是我如何修复它的：

<input hidden autocomplete="username" name="username" type="text" value="{{..}}"/>
<input hidden autocomplete="email" name="email" type="text" value="{{..}}"/>

我使用了最新版本的Chrome（2023年9月），我需要几个单独答案的元素来获得警告：

• 隐藏元素必须在顶部，而不是底部
• 必须是type="text";在我的例子中，我添加了hidden属性，它工作了（没有尝试隐藏样式）
• 它必须有autocomplete="username"

上面任何一个失踪，我得到了警告。