Question

我是javascript的初学者。我想使用切换方法添加隐藏和显示按钮。这是我的html。

<body>
  <header>
    <li><a href="#">Mécanique</a>
      <ul class="sub-menu">
        <li><a href="#">Mécanique du point</a></li>
        <li><a href="#">Mécanique du solide</a></li>
      </ul>
    </li>

  </header>
</body>

Answer 1

在StackOverflow上提出问题之前，请先了解事情的工作原理。我们所有人都还在学习，但是，我们必须自己尝试一些事情。

除此之外，这是如何使用jQuery隐藏/显示.sub-menu的方法，方法是单击包含“Mécanique”单词的a标签，然后给它一个{{1 }}，以便稍后在ID中引用它。

JavaScript

// we put everything in the document.ready handler to ensure that the document has finished loading.
$(document).ready(function() {
  // reference the 'a' tag that I gave it an id of 'trigger', and also referencing the .sub-menu ul.
  var trigger = $('#trigger'),
    menu = $('.sub-menu');
  // adding the event listener to the #trigger to hide/show the .sub-menu ul.
  trigger.on('click', function(e) {
    // cancel the default behaviour when clicking a link.
    e.preventDefault();
    // hide/show the menu.
    menu.toggle();
  });  
});

ul.sub-menu {
  // by default, let's make the .sub-menu ul hidden.
  display: none;
}

希望我进一步推动了你。

如何切换导航栏可见性？

1 个答案: