Como remover o auto complete de inputs do formulários

Publicado em 20/03/2020

Neste artigo aprenderemos a remover o auto complete de inputs de formulários HTML, de uma forma simples utilizando um atributo nativo da própria linguagem.

como remover o auto complete capa

Fala programador(a), beleza? Bora aprender coisa nova!

O auto complete é uma funcionalidade sensacional, ajuda muito os usuários que já preencheram dados em outro site a resgatá-los e utilizar em outros sites

Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

114 aulas
4 projetos
9h 18min

Porém muitas vezes pode causar um problema, então como podemos resolver isto?

Quer se especializar em Desenvolvimento Web? Veja o nosso catálogo de cursos.

A resposta é bem simples, precisamos utilizar um atributo chamado autocomplete no form

E depois setar o valor deste atributo como off, veja o exemplo:

<!DOCTYPE html>
<html>
<head>
    <title>Como remover o auto complete de inputs</title>
</head>
<body>	
    <h1>Preencha o formulário</h1>
    <form autocomplete="off">
        <input type="email" name="email" placeholder="Digite seu e-mail">
        <input type="password" name="password" placeholder="Digite sua senha">
        <input type="submit" value="Login">
    </form>
</body>
</html>

Temos um formulário de login, e conforme citado antes ele possui o atributo autocomplete com valor de off

Isso fará com que a funcionalidade fique desabilitada neste formulário, resolvendo assim o nosso problema

Lembrando que você deve utilizar isso com sabedoria, pois tirar um recurso do usuário pode ser muito maléfico ao seu sistema

Sempre pense bem na jornada dele, ao mudar um comportamento padrão ou esperado que ele pode sentir falta

E além disso tente sempre optar por soluções nativas como esta, não gambiarras com JavaScript

Por que pode levar a um código difícil de ler e ruim de dar manutenção, pense sempre no próximo que irá pegar esta código

Conclusão

Neste artigo vimos uma forma de remover o auto complete de inputs dos formulários HTML

Simplesmente adicionamos o atributo autocomplete com valor off a tag form e o problema estará resolvido

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube

Escrito por | Matheus Battisti

Fundador da Hora de Codar

Programador apaixonado pelo mundo das tecnologias, sempre buscando em aprender e se aprofundar em linguagens, frameworks e o que mais for necessário para executar um bom trabalho. Agora tem uma nova missão que é de passar seu conhecimento adiante para formar novos programadores e especializar mais os que já são.

Canal no YouTube LinkedIn