File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
The moose likes HTML, CSS and JavaScript and the fly likes Hiding a popup span with onblur Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login

Win a copy of Java Interview Guide this week in the Jobs Discussion forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Hiding a popup span with onblur" Watch "Hiding a popup span with onblur" New topic

Hiding a popup span with onblur

Chris Huber

Joined: Mar 26, 2009
Posts: 15
I have a popup that is similar to a 'google suggest' where it creates a drop-down based on the text after each onkeyup... There will be multiple fields like this on a page.

I'm struggling with hiding the popup if the user clicks outside the input box or tabs to the next field. I really want to use onblur, which seems to be designed exactly for this - except when I use it, it hides the popup when you click on a selection in the popup box - prior to it executing the script to put the value in the input box. If it could execute the clicked on action, then hide the box, it would work perfectly.

I'm trying to avoid using the 'find the mouse cursor click and determine if it is inside or outside the popup...' method. With that method I also have to take into account if they tab outside the input box.

Any suggestions?

Here is the slimmed down code:
Campbell Ritchie

Joined: Oct 13, 2005
Posts: 46429
Not a "Java in General" question. Moving to the HTML/JavaScript forum.
Chris Huber

Joined: Mar 26, 2009
Posts: 15
I solved it by nesting the popup within the span.

Eric Pascarello

Joined: Nov 08, 2001
Posts: 15385
The solution most people would do is add logic to your hide function that sees what element the event fired in and see if it is the child of the wrapper. Also your code is not keyboard accessible so you are limiting your audience to having to use a mouse.

I agree. Here's the link:
subject: Hiding a popup span with onblur
It's not a secret anymore!