Pular para o conteúdo

Evento

Algo que acontece na página, tipo um clique, e o código que responde a isso.

Também aparece como "event", "onClick", "listener", "addEventListener", "handler".

No mundo do Design

O Figma chama isso de Interação do protótipo

Evento é qualquer coisa que acontece na interface: clique, digitação, rolagem, envio de formulário, tecla apertada. Você escreve uma função e diz pro navegador chamar ela quando o evento acontecer.

<button onClick={() => setAberto(true)}>
  Abrir
</button>

É a mesma coisa que ligar um botão a uma tela no protótipo do Figma, com a diferença de que aqui o destino não é uma tela, é um pedaço de comportamento.

Os que mais aparecem

Evento Quando dispara
onClick clique ou Enter em elemento focável
onChange valor de um campo mudou
onSubmit formulário enviado
onKeyDown tecla apertada
onFocus, onBlur entrou e saiu do campo

O detalhe de acessibilidade

onClick num <button> funciona com mouse, com Tab mais Enter e com leitor de tela. O mesmo onClick numa <div> só funciona com mouse. É por isso que a escolha da tag importa mais que parece: metade da acessibilidade de um controle vem de graça quando ele é um botão de verdade.

Outros termos de JavaScript

Quer o assunto inteiro e não só a definição? Os guias pegam cada tema do começo ao fim.