jQuery .focusOut() conditional action dependent on next selected element

I have a table cell with a text input #usernameInput and a link #saveLink. Using jQuery I have a function assigned to the click event of the #saveLink.

What I'm trying to acheive is, When the #usernameInput loses focus I want to hide it. Unless it loses focus to the #saveLink. In other words, if the user cli开发者_JAVA技巧ck anywhere other than the #saveLink I want to hide the #usernameInput otherwise call the click event on the #saveLink.

I have no problem handleing the $('#usernameInput').focusout() but I cant get it to detect if the save link was clicked.

Here is what i have so far.

<script type="text/javascript">

$('#usernameInput').focusout(function ()
{

    if (!$('#saveLink').is(':focus'))
    {
        $('#usernameInput').hide();
    }
    return;

});</script>

What I'm trying to acheive is, When the '#usernameInput' loses focus I want to hide it. Unless it loses focus to the '#saveLink'. In other words, if the user click anywhere other than the '#saveLink' I want to hide the '#usernameInput' otherwise call the click event on the '#saveLink'.

Maybe you could bind an event to the body and just check the e.target

$("body").click(function(event){
  if(!$(event.target).is("#saveLink")){
    $("#usernameInput").hide();
  }
});

disclaimer this is just pseudo code for now... update in a bit.

I'm not sure if this is new, but I found found a better way today (3.5 years later): event.relatedTarget is the element you actually clicked.

$elementLosingFocus.focusout(function (event) {
    var $elementYouAreTesting;

    $elementYouAreTesting = $("#whatever");

    if (elementYouAreTesting[0] === event.relatedTarget) {
        // you clicked the element you were testing!
    } else {
        // you clicked something else
    }
});