點擊外部和更多

Question

我希望登錄區域（在下面的代碼中）切換登錄按鈕單擊。另外，我需要在登錄區域以外的任何地方點擊登錄區域，而不是登錄按鈕。

<button id="loginBtn">Login</button> 

<div id="loginArea"> 
    <!-- here is login form --> 
</div> 

我該如何做到這一點？

Answer 1

$(function() { 
    $('#loginBtn, #loginArea').on('click', function(e) { 
     $('#loginArea').show(); 
     e.stopPropagation(); 
    }); 
    $('body').on('click', function() { 
     $('#loginArea').hide(); 
    }); 
}); 

如果點擊位於登錄區域內或按鈕上，則該事件將不會使其進入第二個處理程序以隱藏登錄區域。

Answer 2

使用：

$('body').on('click', '#loginBtn', function(){ 
    $('#loginArea').show(); 
}); 

會顯示登錄，而下面將刪除它，當你點擊它外面：

$(document).on('click', 'body:not(#loginArea)', function(){ 
    $('#loginArea').hide(); 
}); 

Answer 3

是如何形成的？

$('#loginBtn').click(function (e) { 
    $('#loginArea').toggle(); 
    e.stopPropagation(); 
}); 

$(document).on('click',function() { 
    $('#loginArea').hide(); 
});