隱藏元素上模糊，當它顯示

Question

我不明白爲什麼我的功能不工作。 它顯示登錄表單，但當我模糊（單擊表單以外的其他地方）它不會隱藏。

這裏是我的缺陷代碼：

$(document).on('click', '#login-btn', function(){ 
     var $form = $("#login"); 
     $form.show("slow"); 
     $("#login").on('blur', function(){ 
     $form.hide("slow"); 
     });  
}); 

Answer 1

你可能不希望這種模糊，只當點擊事件被開除處理。 移動模糊事件出來的單擊事件

var $form = $("#login");  
$(document).on('click', '#login-btn', function(){ 
    $form.show("slow"); 
    $('#loginUsername').focus(); 
}); 
$form.on('focusout', function(){ 
    $form.hide("slow"); 
}); 

Answer 2

你可以這樣做的：

var $form = $("#login"); 
$(document).on('click', '#login-btn', function() {  
    $form.show("slow"); 
}).on('blur', '#login', function() { 
    $form.hide("slow"); 
});