8

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 reasons I can't use something like jQuery live. Basically I'd like something that can given an arbitrary select element (no other attached event handlers, classes, etc), can give a true/false answer on whether it is expanded or not.

For my specific application, I am handling mouse wheel events, but don't want to handle them when a drop down is open (which would override the browser default functionality). However, I still want to handle the mouse wheel events when the mouse has hovered over the select, but has not opened it.

7
  • 1
    Without seeing how the dropdown is implemented, there's not really anything we can do. Commented May 27, 2011 at 19:01
  • Sorry, standard HTML <select>. Updating title. Commented May 27, 2011 at 19:03
  • 1
    So basically you want to create some functionality as a result of an event, but you don't want to use an event handler? I don't get it. If there were some way to just determine at a point in time if the dropdown was open, instead of just using an actual event to figure this out, when would you run this detection code, on a timer or something? Isn't this exactly what event handlers are for? Commented May 27, 2011 at 19:06
  • @jamietre I think what he means is that he'll use an event for the mousewheel, but doesn't want to have global variable tracking the select's state, with event handlers on that select changing the global variable. ...If that makes sense. Commented May 27, 2011 at 19:09
  • OK I get it. So one could either test some (possibly nonexistent) property on every mousewheel event, or test some property you set yourself as a result of events on the select, or bind/unbind as a result of the select. Can't think of many problems with the two latter solutions. Commented May 27, 2011 at 19:12

2 Answers 2

7

I looked into this before, for similar reasons. I could never find a solution other than trying to track it manually which really doesn't work. There are several ways to open/close a select (drop down) such as Alt+Dn Arrow. An open select will close if the user clicks on something outside the browser. Trying to keep track of the state of the select is an exercise in futility. Unless someone else comes along with something I missed on my hunt, you'll have to code around it as elegantly as you can.

Sign up to request clarification or add additional context in comments.

1 Comment

Yep, that's what I thought. I'll just have it ignore mousewheel events when hovered over <sigh>.
3

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.

1 Comment

Rather not keep state. But otherwise, yeah, that'd do it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.