HTML 如何防止Chrome提示保存输入框中的密码

使用autocomplete属性

HTML的autocomplete属性可以用来指示浏览器是否应该保存特定输入字段的值。这个属性可以设置为以下几个值：

on ：浏览器会提示保存密码；

off ：浏览器不会提示保存密码；

new-password ：浏览器会提示保存一个新的密码，但不会填充之前保存的密码；

下面是一个例子，展示了如何使用autocomplete属性来防止Chrome提示保存密码：

<form>
  <label for="username">用户名：</label>
  <input type="text" id="username" autocomplete="off"/>

  <br/>

  <label for="password">密码：</label>
  <input type="password" id="password" autocomplete="new-password"/>

  <br/>

  <input type="submit" value="登录"/>
</form>

在上面的例子中，我们给用户名输入框设置了autocomplete="off"，意味着浏览器不会提示保存该输入框的值。同时，我们给密码输入框设置了autocomplete="new-password"，这样浏览器会提示用户保存一个新的密码，但不会填充之前保存的密码。

使用form属性

除了对单个输入字段使用autocomplete属性，我们还可以对整个表单使用autocomplete属性，以一次性禁止浏览器保存所有输入字段的值。我们可以将autocomplete属性设置为off，示例如下：

<form autocomplete="off">
  <label for="username">用户名：</label>
  <input type="text" id="username"/>

  <br/>

  <label for="password">密码：</label>
  <input type="password" id="password"/>

  <br/>

  <input type="submit" value="登录"/>
</form>

在上面的例子中，我们给整个表单设置了autocomplete="off"，这样浏览器将不会提示保存表单中任何输入字段的值。

使用inputmode属性

另一个可以防止Chrome浏览器提示保存密码的属性是inputmode。这个属性可以用于指定输入字段的预期输入模式。如果我们将输入模式设置为密码模式，浏览器就不会提示保存密码。示例如下：

<label for="password">密码：</label>
<input type="text" id="password" inputmode="numeric" pattern="[0-9]*"/>

在上面的例子中，我们将输入字段的类型设置为文本，然后使用inputmode属性将输入模式设置为数字。这样，浏览器将不会提示保存该输入框的值，因为它不会被认为是一个密码输入框。

来源：https://geek-docs.com/html/html-ask-answer/553_html_prevent_chrome_from_prompting_to_save_password_from_input_box.html