HTML

Como remover o auto complete de inputs do formulários

20 de março de 2020

Como remover o auto complete de inputs do formulários

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

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

Subscribe
Notify of
guest
0 Comentários
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x