在 onfocus 表单字段中隐藏密码管理器自动完成

问题描述

我通过密码管理器在 Chrome 浏览器中保存了密码,并且我有以下输入字段

<input type="text" placeholder="" formControlName="username" #log_name autocomplete="off">
<input type="password" placeholder="" formControlName="password" #pass autocomplete="off">

每次刷新页面时,浏览器都会自动填充字段

enter image description here

enter image description here

我所做的是输入 readonlyonfocus 以禁用自动填充

<input type="text" placeholder="" formControlName="username" #log_name autocomplete="off" 
readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly');}>

<input type="password" placeholder="" formControlName="password" #pass autocomplete="off" 
readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly');}>

现在自动填充会停止每次刷新,这很好。

问题

有没有办法可以隐藏密码管理自动填充字段的焦点(那个黑色)?

enter image description here

解决方法

Try adding autocomplete to the form as shown below

<form name="loginForm" autocomplete="off">
<input type="text" placeholder="" formControlName="username" #log_name autocomplete="off" 
readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly');}>

<input type="password" placeholder="" formControlName="password" #pass autocomplete="off" 
readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly');}>
</form>