javascript - When to close custom build jQuery dropdown -

i made simple dropdown using <div> (parent), <span> (current selection) , <ul> (options). works fine. want if user clicks anywhere on page, have close, "real" <select> element.

what this:

$(document).delegate('body','click',function(){    if(isexpanded){close();} }); 

and works. worried performance. wise listen click events on document node? there better way?

thank you.

you make use of blur event. while elements don't support default, adding tabindex=... makes them fire blur event: http://jsfiddle.net/ugsta/.

html:

<div tabindex="1">     <ul>         <li>1</li>         <li>2</li>         <li><span>3</span></li>     </ul> </div> 

javascript:

$('div').blur(function(){alert(1)})