1

It's a fairly common pattern to have a dialog, a menu, or some other HTML element with a link inside it pop up in response to a click. For example, if you click the orange question mark above the Stack Overflow edit box, it adds a bunch of links for "Links", "Images", etc. Then, when you click the question mark again, the menu goes away.

I have a similar setup, only I want the menu to go away when the user clicks anywhere except the menu. This isn't hard ($(document.body).click(handleClickElsewhere)). However, what is hard is the following case:

  1. The user clicks to bring up the menu
  2. The user right-clicks on one of the links in the menu (making the browser context menu appear)
  3. The user left-clicks on the browser's context menu, on the "Open in new tab" menu item
  4. The user is taken to the link in a new tab, BUT
  5. The menu stays open back on the original page

The hard part about the above is that I would like to instead close the menu in that case; it looks kind of silly when the user returns to their original tab, and the menu is still open. Unfortunately, there doesn't seem to be any way to detect that the user clicked "Open in new tab", and thus there's no way for me to close the menu in response. I can close the menu in response to the user's right click (step #2 above), but then they won't be able to pick "Open in new tab" because the link will be gone.

I've tried jQuery's click, mouseup, mousedown, and contextmenu events, but none of them seem to catch this case.

Has anyone else figured out a solution to this? Alternatively, if it's impossible, can anyone more knowledgeable than me definitively explain why? My guess is the browser just doesn't tell you about the click in step #4, but I have no real basis for that guess.

Dave Clemmer
  • 3,741
  • 12
  • 49
  • 72
machineghost
  • 33,529
  • 30
  • 159
  • 234

1 Answers1

1

you could check if the window lost focus, and react appropriately after that (which is to close your menu)

but this assumes that the browser was set to "switch to new tab" by default. some users might choose the setting of opening the new tab in the background, so the main window does not lose focus and this method will not work. (but hey, who wants to close the menu if i am still looking at it anyway?)

Joseph
  • 117,725
  • 30
  • 181
  • 234
  • That's a great idea, but that approach has one minor problem: in my browser at least, when you select "Open in new tab" it doesn't immediately switch to that tab. So, while the menu would go away as it should once the user clicks on the new tab, until then it sticks around. If that's the best possible outcome that's ok, but if there's any way to avoid that it'd be great. – machineghost Mar 23 '12 at 23:03
  • the closest one can get is detecting the context menu event http://stackoverflow.com/a/4909687/575527 but not the item that was clicked. – Joseph Mar 23 '12 at 23:14
  • That's what I was afraid of; thanks for the focus suggestion though :) – machineghost Mar 24 '12 at 00:58