JQuery form auto submit clicking out side the div

I want to auto-sumbit my form once user clicks out side the div of the form.

I tried the following but it submits within clicking within the div.

&l开发者_StackOverflowt;div id="formDiv">
<form id="search">
  <input id="target" type="text" value="Field 1" />
  <input type="text" value="Field 2" />
</form>
</div>

// auto submit 
jQuery('#formDiv').live('blur',function() { 
    $(this).children('form').submit();

    });

Off-hand, the only thing I can suggest it so attach to the click event of the body, then also attach to the div's click event and e.preventDefault() to halt it. Alternatively, you could bind to each form element's focus/blur event with a .delay. If they lose focus from one element and aren't in another, submit the form.

EDIT

See if this is what you're looking for:

Javascript:

var queueSubmit;

$('#sample input').each(function(i,e){
    $(this).bind('focus',function(){
        clearTimeout(queueSubmit);
    });
    $(this).bind('blur',function(){
        queueSubmit = setTimeout(function(){ $('#sample').submit(); }, 1000);
    });
});

$('#sample').bind('submit',function(){
    clearTimeout(queueSubmit);
    alert('Pseudo-Submitted!');
    return false;
});

Sample HTML

<div id="main">
    <p>&nbsp;</p>
    <div id="main-form">
        <form id="sample" method="POST" target="">
            <fieldset>
                <legend>My Sample Form</legend>
                    First Name: <input type="text" id="first_name" /><br />
                    Last Name: <input type="text" id="last_name" /><br />
                    Telephone: <input type="text" id="telephone" /><br />
                    <input type="submit" value="Submit" />
            </fieldset>
        </form>
    </div>
    <p>&nbsp;</p>
</div>

Working Example Here

I would do this by putting a click handler on the body and seeing if the event target (event.target) is a descendent element of #formDiv:

$('#search').one('focus', function() { // the first time that a field in #search receives focus
    var $formDiv = $('#formDiv');
    $(document.body).click(function(e) { // bind a click handler to the document body
        if (!$formDiv.has(e.target).length) { // if the target element is not within formDiv
            $('#search').submit(); // submit the form
        }
    });
});