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!

desativar eventos de um elemento em JavaScript capa

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 Claude Code
Formação Recomendada

Formação Claude Code

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

  • 120 aulas
  • 4 projetos
  • 9h 45min

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!

Escrito por | Matheus Battisti

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.

Subscribe
Notify of
guest

0 Comentários
Oldest
Newest Most Voted

Formações

Formação Vibe Coding

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

  • 474 aulas
  • 20 projetos
  • 39h 27min

Blog | Mais populares