Как предотвратить фокусировку при срабатывании фокуса на одном и том же элементе?

Question

Я прикрепляю активный класс к div, который обернут вокруг ввода и метки.

Моя проблема в том, что элемент щелкнут внутри обернутого DIV, фокус будет срабатывать, и это вызывает небольшое мерцание стиля.

$('body') 
    .on('focusin', '.formlabel', function() { 

     $(this).addClass('active'); 

    }) 
    .on('focusout', '.formlabel', function() { 

     $('.formlabel').removeClass('active'); 

    }); 

Вот пример: http://jsbin.com/mamacogimo/1/edit?html,js,output - нажмите на метку и элемент из выпадающего списка. Вы заметите, что синий фон мерцает.

Есть ли способ предотвратить мерцание?

Answer 1

Вы можете использовать тайм-аут, например, так:

var timeout; 
$('body').on('focusin', '.formlabel', function() { 
    $(this).addClass('active'); 

    clearTimeout(timeout); 

}).on('focusout', '.formlabel', function(e) { 
    timeout = setTimeout(function() { 
    $('.formlabel').removeClass('active'); 
    }, 250); 
}); 

http://jsbin.com/dafubiweto/2/edit