主页 / 问题 / 1363272
Accepted
Кот
Asked:2022-05-18 03:50:39 +0000 UTC2022-05-18 03:50:39 +0000 UTC

如何在按钮单击时显示表格？

  • 772

我怎样才能做到这一点，当单击桌面时，而不是夹住时？

ul.nav li:active>ul {
  display: block;
}
<ul class="nav">
  <li><a href="#">фильтр</a>
    <ul>
      <li><a href="#">пункт 1.1</a></li>
      <li><a href="#">пункт 1.2</a></li>
      <li><a href="#">пункт 1.2</a></li>
    </ul>
  </li>
</ul>

html

2 个回答

  1. Best Answer

    我认为这将有助于解决这个问题 - focus：

    CSS .nav {
  display: inline-block;
  position: relative;
}

.down-menu {
  opacity: 0;
  pointer-events: none;
  transition: all .2s ease
}

.btn:focus+.down-menu {
  pointer-events: auto;
  opacity: 1;
}
    <ul class="nav">
  <li><a class="btn" href="#">фильтр</a>
    <ul class="down-menu">
      <li><a href="#">пункт 1.1</a></li>
      <li><a href="#">пункт 1.2</a></li>
      <li><a href="#">пункт 1.2</a></li>
    </ul>
  </li>
</ul>

    • 1 

  2. document.querySelector('.li').addEventListener('click', ()=>{
document.querySelector('.ul').classList.toggle('active')
})
    .ul.active {
  display: none;
}
    <ul class="nav">
  <li class="li">фильтр
    <ul class="ul">
      <li><a href="#">пункт 1.1</a></li>
      <li><a href="#">пункт 1.2</a></li>
      <li><a href="#">пункт 1.2</a></li>
    </ul>
  </li>
</ul>

    • 0

相关问题