Question

当您点击切换按钮（http://international-aset.com/intaset/）时，我正在尝试打开我的移动导航;但是由于某种原因，当您单击按钮本身时它不起作用，但是当您单击按钮的SURROUNDING区域时它会起作用。

编辑：我要做的是通过单击切换按钮打开导航，然后启用切换动画。现在，切换按钮有效但单击按钮时我的导航无法打开。我的导航打开的唯一时间是单击切换按钮周围的周围区域（空白区域）。

我希望这更有意义，如果不是，请告诉我，我会尽力让自己更清楚。

以下是HTML代码：

<label for="toggle">
  <div class="menu-icon-container">
    <a href="#" class="menu-toggle" id="menu-toggle"><span></span></a>
  </div>
</label>

这是JS：

<script type="text/javascript">
  $( document ).ready( function( $ ) {
    $('.menu-icon-container').on('click', function(event) {
      document.getElementById('menu-toggle').addEventListener('click', function() {
        this.classList.toggle('menu-toggle-active');
      });
    });
  });
</script>

感谢您的帮助！

Answer 1

你可能只想要这个：

$('#menu-toggle').click(function() {
    $(this).toggleClass('menu-toggle-active');
});

如果你的元素在页面加载时不存在，那么你真的需要on()。如果你确实需要它，请执行以下操作：

$(document).on('click', '#menu-toggle', function() { ... });

Answer 2

尝试在点击事件后添加#menu-target：

$('.menu-icon-container').on('click', function(event) {
    $("#menu-toggle").classList.toggle('menu-toggle-active');
});

如何指定我的切换按钮以打开我的菜单？

2 个答案: