Novidades do jQuery 1.4 – #3: Eventos focusin e focusout

O jQuery 1.4 trouxe dois novos eventos bem interessantes: focusin e focusout. À primeira vista, eles parecem fazer o mesmo que os eventos focus e blur, mas na verdade eles tem uma peculiaridade interessante.

Diferentemente do focus, o evento focusin é disparado quando qualquer elemento dentro do elemento pai recebe foco. Para entender melhor:

$('.focusin').focusin(function(){
    $(this).css('background','blue');
}).focusout(function(){
    $(this).css('background','red');
});
$('.focus').focus(function(){
    $(this).css('background','blue');
}).blur(function(){
    $(this).css('background','red');
});

Legal, né?

Eu, particularmente, sentia falta desses dois eventos. Principalmente pra mudar a cor de formulários, etc quando o usuário "focava" em inputs... antes era necessário fazer um loop e aplicar o evento a cada input dentro do formulário, agora ficou muito mais simples.

Leia mais sobre o focusin e focusout na documentação da API do jQuery.