jquery 菜单收缩展开

使用jQuery实现菜单的收缩和展开，可以通过监听一个按钮的点击事件来切换菜单的显示和隐藏状态。以下是一个简单的实例代码：

HTML:




<button id="menu-toggle">切换菜单</button>
<ul id="menu" style="display: none;">
  <li>菜单项 1</li>
  <li>菜单项 2</li>
  <li>菜单项 3</li>
</ul>

jQuery:




$(document).ready(function() {
  $('#menu-toggle').click(function() {
    $('#menu').slideToggle();
  });
});

这段代码中，slideToggle 方法会在显示和隐藏之间切换元素，并且提供了一个平滑的滑动效果。当用户点击按钮时，关联的菜单会以滑动动画显示或隐藏。