Detect if an HTML select element is expanded (without manually tracking state)

Question

I\'d like to detect if a drop down is expanded or not. I don\'t want to use extra event handlers for click/mouseover etc because the drop-downs are dynamic and for other rea

Answer 1

How about when it's got focus, even if it isn't expanded? You specifically ask for expanded because you don't want to override default browser behaviour, but the browser behaviour should be to scroll through the items when the item is focussed, even if it isn't expanded, so I would say you'd be better off detecting focus.

If you're okay with that, then you can certainly easily detect when a field has focus and when it loses it, by using the JQuery focus() and blur() methods, or focusin() and focusout().

http://api.jquery.com/focus/ and http://api.jquery.com/blur/

http://api.jquery.com/focusin/ and http://api.jquery.com/focusout/

Hope that helps.