Dropdown not opening when using focus and focusout

问题

I have two dropdowns with same the same class let’s call it dropdown and I do this fiddle with the dropdowns with jquery:

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

When I jump between two dropdowns with the same class (dropdown) the drop down doesn’t open immediately instead it get focus and I have to click on it again in order to open it up. It seem to have something to do with the fact that I enable and disable options in the list when I fiddle with it. Is there a workaround?

(I have tried to use blur instead of focusout and the same problem occur)

Thanks!

Edit:

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>

回答1:

try this

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

来源：https://stackoverflow.com/questions/6517582/dropdown-not-opening-when-using-focus-and-focusout

标签

javascript

jquery

html

javascript-events