jquery：div隱藏/顯示焦點問題

Question

感謝inti的代碼我能夠找出答案！

的jQuery：

$(document).ready(function(){ 
    $("body").click(function(e) { 
     //checks to see if the tag you clicked has the #login 
     //div as a parent. 
     if($(e.target).closest("#login").size() == 0) { 
      //makes exception for the #login's <a> tag (id of a_login) 
      if((e.target.id) == 'a_login') { 
       $("#login").show(); 
      } else { 
       $("#login").hide(); 
      } 
     //if target has #login as parent, keep it visible 
     } else { 
      $("#login").show(); 
     } 
    }); 

}); 

工作的jsfiddle例如：http://jsfiddle.net/SuperPhil/3CmE7/

謝謝！

---

我想要登錄屏幕類似http://dropbox.com登錄。用戶點擊登錄鏈接並顯示div（CSS）並在焦點出現時消失。

這裏是我的jQuery

$('#login').bind('click', function() { 
    $('#login').addClass("clicked").focusout(function() { 
     $('#login').removeClass('clicked'); 
    }); 
}); 

這是行不通的。誰能幫我嗎？

編輯：

$('#login').click(function() { 
    $('#login div').addClass("clicked").blur(function() { 
     $('#login div').removeClass('clicked'); 
    }); 

}); 

Answer 1

你正在尋找的事件是.blur()不.focusout()。

編輯：點擊了#mydiv來隱藏它：

$("body").click(function(e) { 
    if ($(e.target).closest("#mydiv").size() == 0) { 
     $("#mydiv").hide(); 
    } 
}); 

如果這個隱藏#mydiv你點擊沒有它，因爲它的父母之一。

Answer 2

我想你[R看起來像這樣...

HTML：

<a href="#">Click Me</a> 

<div id="login"> 
    <label>Username:</label><input type="text"/><br/> 
    <label>Password:</label><input type="password"/><br/> 
</div> 

的jQuery：

$(document).ready(function(){ 
    $("#login").hide(); 
    $('a').bind('click', function() { 
     $("#login").toggle().focus(); 
    }); 
    $("input").focusout(function(){ 
     $("#login").hide(); 
    }); 
}); 

http://jsfiddle.net/anish/ccFt9/1/