Javascript 隐藏模糊列表

当我点击按钮时，会出现一个列表，问题是当列表失去焦点时，我想隐藏列表，即用户点击页面上的任意位置，但不在该列表上。我该怎么做？此外，您还可以查看它在last.fm中的外观，其中是配置文件设置列表（

li.profileItem

）。 （

ul.delli ul

默认为

显示：无

） 基本列表结构：

<ul class='del'>
    <li>
        <button class='deletePage'></button>
        <ul>
            <li></li>
            <li></li>
        </ul>
    </li>
</ul>

看

您可以将

单击

处理程序绑定到

文档

以隐藏列表，然后将单独的处理程序附加到调用的按钮

或者，您可以使用：

---

查看添加了

bind（'clickout'）

功能以处理类似的事情。

您可以使用文档单击事件。如果用户在div内单击，事件传播将停止（例如stopPropagation），否则将由文档单击事件处理，该事件将检查菜单是否打开以及是否关闭

$(document).click(function() { 
  // check if the menu is open, if so close it
});

$("#windowdiv").click(function(e){
  e.stopPropagation();
  // do stuff
});

$(document).click(function() {
 $('.list-to-hide').hide();
});

$('.show-list-button').click(function(event) {
 event.stopPropagation();
});

$('.show-list-button').bind('clickoutside', function() {
 $('.list-to-hide').hide(); 
});

$(document).click(function() { 
  // check if the menu is open, if so close it
});

$("#windowdiv").click(function(e){
  e.stopPropagation();
  // do stuff
});