Ao criar formulários HTML, pode ser necessário desativar a funcionalidade de autocompletar oferecida pelos navegadores. Essa prática é útil para aumentar a privacidade ou evitar preenchimentos automáticos indesejados.
Para desativar o autocompletar em um formulário inteiro, use o atributo autocomplete="off"
no elemento <form>
. Veja o exemplo:
<form autocomplete="off">
<label for="username">Usuário:</label>
<input type="text" id="username" name="username" placeholder="Digite seu usuário">
<label for="password">Senha:</label>
<input type="password" id="password" name="password" placeholder="Digite sua senha">
<button type="submit">Enviar</button>
</form>
Caso você prefira desativar o autocompletar apenas em campos específicos, o atributo autocomplete="off"
pode ser aplicado diretamente nos elementos <input>
. Aqui está um exemplo:
<form>
<label for="email">E-mail:</label>
<input type="email" id="email" name="email" autocomplete="off" placeholder="Digite seu e-mail">
<label for="phone">Telefone:</label>
<input type="tel" id="phone" name="phone" autocomplete="off" placeholder="Digite seu telefone">
<button type="submit">Enviar</button>
</form>
Os navegadores podem, em alguns casos, ignorar o atributo autocomplete="off"
, especialmente em campos de senha. Para contornar essa situação, você pode usar nomes alternativos para os campos ou ocultar um campo fictício com display: none
.
Embora bloquear o autocompletar possa melhorar a privacidade, essa prática também pode dificultar a experiência do usuário. Por isso, utilize essa abordagem apenas quando realmente for necessário.