Como desativar eventos de um elemento em JavaScript

Neste artigo você vai aprender a como desativar eventos de um elemento em JavaScript, utilizando apenas CSS!

Fala programador(a), beleza? Bora aprender mais sobre os eventos de DOM!

Estranho pensar que uma regra de CSS pode resolver o nosso problema, certo?

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

Mas isso é até normal, pois HTML, CSS e JavaScript andam juntos em diversas questões

A regra em questão é a pointer-events, e vamos colocar um valor de none para ela

Isso faz com que o evento de click não funcione mais neste elemento, que geralmente é o nosso problema

Ocorre muito em duas situações:

• Elementos internos não deixando o evento do elemento externo ser executado;
• Elementos posicionados com absolute interrompendo os eventos de outros elementos;

Agora veja o código que você deve aplicar:

.el {
 pointer-events: none;
}

Onde, é claro, você deve trocar .el para o seletor do elemento que você quer excluir o evento

Desta maneira o seu problema estará resolvido! 🙂

Bem simples, não acha?

Quer aprender mais sobre JavaScript? Confira o vídeo abaixo:

Conclusão

Neste artigo você viu como desativar eventos de um elemento em JavaScript

Utilizamos uma regra de CSS chamada pointer-events, que pode desabilitar os eventos de click

Para isso devemos colocar o valor da regra como none

Deseja programar de forma profissional? Confira o nosso treinamento completo clicando aqui.

Uma plataforma de cursos com projetos completos, comunidade de alunos e muito mais!

Há também o nosso canal no YouTube, com muito conteúdo gratuito de qualidade!