聚焦和模糊HTMLDivElement的事件？

Question

我使用HTML，CSS和JavaScript实现了自定义下拉列表。它现在运作良好，但我对我现在“模糊”的方式感到不满意。当您打开列表，然后单击其他位置时，它应该崩溃。我做的是在展开列表后向mousedown添加了一个事件监听器（window），并在折叠后删除了监听器。该事件基本上使用target检查DOM事件是否发生在右侧元素上，如果没有，则模糊下拉控件。

我了解focus和blur。但是，它们似乎只对表单元素起作用，我觉得这很容易理解。他们还支持其他情况，例如何时“标记”。

无论如何，我问你是否有更好的方法来做我现在正在做的事情。我做的只是感觉很愚蠢。

Answer 1

也许你可以有一个虚拟输入并在控件处于活动状态时关注它。然后观看模糊并关闭列表。它不可能是display:none，但可能是opacity:0，或者只是在视野之外。

Answer 2

我的工作是使用mouseout关闭我的自定义列表。我在下拉菜单周围创建了一个边界框。该框附有onmouseout事件，当鼠标移出它时，它会关闭下拉列表。通过这种方式，您可以在列表外部添加一些填充，这样可以为用户提供更好的功能，然后只需将鼠标移到基本列表中即可。

如果你想使用点击事件来做，我会有一个全局功能，就像你似乎有设置一样，并在页面上的任何点击事件上调用该功能。