jquery - 当 div 失去焦点时如何隐藏它？

Question

基本上我正在尝试实现一个登录，例如新的 Twitter 的登录。当您单击“登录”时，会弹出一个带有字段的 div。现在，当我单击 div 外部的任何位置(div 失去焦点)时，div 应该消失。

我已经尝试过 How to blur the div element? 中提到的技术

代码如下:

$("body").click(function(evt) {
            
            if (evt.target.id !== 'loginDialog') {
                $("#loginDialog").hide();
            }
        });

问题在于，即使我在子 div 中单击 loginDialog 内的某个位置，target.id 也不会等于 loginDialog .

所以上述是一个很好的前进方向，但解决方案并不完整。

实现这一目标的最佳方法是什么？

Answer 1

如果将鼠标移到外部还不够，并且您希望只有在用户单击鼠标外部时鼠标才会消失，那么这里的代码片段可能会对您有所帮助。

$('body').click(function(evt) {
    if($(evt.target).parents('#loginDialog').length==0) {
        $('#loginDialog').hide();
    }
});