jQuery lose focus event

xijo picture xijo · Sep 14, 2009 · Viewed 256.9k times · Source

I'm trying to show up a container if a input field gets the focus and - that's the actual problem - hide the container if focus is lost. Is there an opposite event for jQuery's focus?

Some example code:

<input type="text" value="" name="filter" id="filter"/>

<div id="options">some cool options</div>

<script type="text/javascript">
  $('#options').hide();

  $('#filter').focus(function() {
    $('#options').appear();
  });
</script>

And what I'd like to do is something like this:

$('#filter').focus_lost(function() {
  $('#options').hide();
});

Answer

Canavar picture Canavar · Sep 14, 2009

Use blur event to call your function when element loses focus :

$('#filter').blur(function() {
  $('#options').hide();
});