unexpected "focusout" event trigering
<p>I try to show text box (#dimVal), when div(#CanvasArea) is clicked. And I want to make this text box disappear, when it loses its focus.</p>

<pre><code>    &lt;head&gt;
    &lt;script src="jquery-1.5.1.js" type="text/javascript"&gt;&lt;/script&gt;
    &lt;/head&gt;

    &lt;body&gt;
    &lt;div id = "CanvasArea", style = "width:50%; height:600px; border:2px; border-color:orange; border-style:solid; float:left"&gt;
    &lt;h3&gt;Click Me&lt;/h3&gt;
    &lt;/div&gt;

    &lt;input type="text", id="dimVal", value="111", style="position:absolute; display:none; left:300px; top:300px" /&gt;

    &lt;script type="text/javascript"&gt;
    onMouseDown = function(e){
        $("#dimVal").show();
        $("#dimVal").focus();
        $("#dimVal").focusout(onLostFocus);
    }

    onLostFocus = function(e){
        $("#dimVal").hide();
        $("#dimVal").unbind("focusout");
    }

    $("#CanvasArea").bind("mousedown", onMouseDown);
    &lt;/script&gt;

    &lt;/body&gt;
</code></pre>

<p>I wonder why "focusout" event fires right after mouseclick?</p>
