Nós vimos nas lições anteriores como se seleciona um objeto, altera seu posicionamento e seus atributos, hoje iremos ver como se faz para adicionar eventos aos elementos. Cada browser trata o evento de uma forma e nisso que o jQuery nos facilita, ele proporciona uma api cross-browser para tratamento de eventos.

Resposta:

Se você quisesse colocar para exibir um alert quando o usuário clicasse em uma imagem, como seria? Na old-fanshioned way seria algo mais ou menos assim

HTML:

Usando o comando bind e unbind

A assinatura do método bind é:

bind(event, [data], fn)

Para adicionar um alert na imagem faremos então:

Javascript:

O bind também permite adicionar múltiplos eventos, através do encadeamento tradicional do jQuery.

Javascript:

Podemos remover um evento através do comando unbind(event,fn), você pode estar pensando "Se estou fazendo o unbind porque também passo uma função ?" - Você pode querer executar alguma rotina ao fazer o processo de unbind.

Javascript:

Podemos disparar um evento manualmente através do comando trigger( type, [data] )

Javascript:

Para os eventos nativos o jQuery tem um "atalho", por exemplo para disparar o evento de click como acabamos de mostrar acima, poderiamos fazer apenas

Javascript:

Assim como poderíamos adicionar um evento omitindo o bind

Javascript:

Os eventos nativos são: blur, focus, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, keyup, error.