当我们在JavaScript区域外单击时,如何关闭下拉列表

izkcnapc  于 2023-03-21  发布在  Java
关注(0)|答案(1)|浏览(153)

我想在我们单击openLogin区域之外时隐藏openLogin。
我的代码:

function openLogin() {
  const navUserDropdown =
    document.querySelector('.navUser__dropdown-user');
  if (navUserDropdown.style.display === 'block') {
    navUserDropdown.style.display =
      'block';
  } else {
    navUserDropdown.style.display = 'block';
  }
}
<div class="nav__panel-user" onclick="openLogin()">
  <div class="nav__block-user">
    <a class="nav__user-bottom">
      <i class="fa-regular fa-user" style="font-size: 20px; "></i>
    </a>
  </div>
</div>
r1zk6ea1

r1zk6ea11#

你可以在你的窗口对象上添加一个点击事件监听器。然后你检查你的下拉列表是否被点击。如果是,那么中断(return false)。如果不是,那么你可以设置navUserDropdown.style.display = 'none'

相关问题