Раскрывающийся список не открывается при использовании фокуса и фокуса

Question

У меня есть два раскрывающихся списка с одним и тем же классом, назовем это раскрывающимся списком, и я делаю эту скрипку с раскрывающимися списками с помощью jquery:

$('.dropdown').focus(function () {
    //Fiddle with this dropdown
}).focusout(function () {
    //Fiddle with this dropdown
});

Когда я переключаюсь между двумя раскрывающимися списками с одним и тем же классом (раскрывающийся список),раскрывающийся список открывается не сразу, вместо этого он получает фокус, и мне приходится снова нажимать на него, чтобы открыть его.Кажется, это как-то связано с тем, что я включаю и отключаю опции в списке, когда возлюсь с этим.Есть ли обходной путь?

(я попытался использовать размытие вместо фокусировки, и возникла та же проблема)

Спасибо!

Редактировать:

jsfiddle

JS:

$('.dropdown').focus(function () {
    var selectListIndex = $(this).attr('selectedIndex');
    $('.dropdown').each(function() {
        $('option:nth-child(' + (selectListIndex + 1) + ')', $(this)).attr('disabled', '');
    });
}).focusout(function () {
    var selectListIndex = $(this).attr('selectedIndex');
    $('.dropdown').not($(this)).each(function() {
        $('option:nth-child(' + (selectListIndex + 1) + ')', $(this)).attr('disabled', 'disabled');
    });
});

HTML:

<select class="dropdown">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>
<select class="dropdown">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

Answer 1

попробуйте

$('.dropdown').focus(function () {
    $('.dropdown').focusout() 
});