Novos eventos DOM em html5

Uma palavra sobre eventos

O suporte ao tratamento de eventos disparados pelo usuário é parte essencial do DOM. HTML5 oferece a você um extenso conjunto de novos eventos. Vamos dar uma olhada nos mais interessantes:

Elementos multimídia:
oncanplay
O elemento audio ou video já tem dados suficientes no buffer para começar a tocar.
oncanplaythrough
O elemento audio ou video já tem dados suficientes no buffer para começar a tocar e, se a tranferência de dados continuar no ritmo em que está ocorrendo, estima-se que tocará até o final sem interrupções.
ondurationchange
O elemento audio ou video teve seu atributo duration modificado. Isso acontece, por exemplo, ao alterar a origem da mídia.
onemptied
O elemento audio ou video teve um erro de retorno vazio de dados da rede. O retorno vazio acontece quando, por exemplo, você tenta invocar o método play de um elemento que ainda não tem uma origem de mídia definida.
onended
O vídeo ou áudio chegou ao fim.
onloadeddata
Os dados começaram a ser carregados e a posição atual de playback já pode ser renderizada.
onloadedmetadata
Os metadados foram carregados. Já sabemos as dimensões, formato e duração do vídeo.
onloadstart
Os dados começaram a ser carregados.
onpause
O usuário clicou em pause.
onplay
O usuário clicou em play ou o playback começou por causa do atributo autoplay
onplaying
O vídeo ou áudio está tocando.
onprogress
O agente de usuário está buscando dados do vídeo ou áudio.
 
Eventos em campos de formulário:
oninput
O usuário entrou com dados no campo
oninvalid
O campo não passou pela validação
 
Eventos gerais:
oncontextmenu
O usuário disparou um menu de contexto sobre o objeto. Na maioria dos sistemas Desktop, isso significa clicar com o botão direito do mouse ou segurando uma tecla especial.
onmousewheel
A rodinha do mouse foi acionada.
onbeforeprint
Disparado antes da impressão da página. Você pode usá-lo para modificar, esconder ou exibir elementos, preparando a página para impressão.
onafterprint
Disparado após a impressão da página. Você pode usá-lo para reverter o status anterior à impressão.
onhashchange
A última porção da URL, após o hash (#), foi modificada.
onoffline
O agente de usuário ficou offline.
ononline
O agente de usuário está novamente conectado.
onredo
O usuário disparou a ação de “Refazer”.
onundo
O usuário disparou a ação de “Desfazer”.
 
Drag-and-drop:

Vimos a definição desses eventos no post Drag-n-drop e correção ortográfica:

  •  ondrag
  •  ondragend
  •  ondragenter
  •  ondragleave
  •  ondragover
  •  ondragstart
  •  ondrop

Atributos de evento

A especificação do HTML5 padronizou um formato de atribuição de eventos que já era amplamente utilizado. Você pode atribuir eventos através de atributos HTML com o nome do evento. Por exemplo:

<input onblur="return verifica(this)" />

É claro que você pode continuar usando o método do DOM addEventListener, com a vantagem de poder atribuir vários listeners ao mesmo evento.

Anúncios

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s