javascript - 通过类处理两个slideUp/Down

Question

我的网站的移动 View 中有两个菜单。如果您单击汉堡包栏，它们应该向下/向上滑动。这对我来说基本上没有问题。

我的 HTML 看起来像这样:

...
<div class="foo">
  <div class="trigger menu1">
    ..
  </div>
  <div class="trigger menu2">
    ...
  </div>
</div>
...
<nav id="main-navi">
  ...
</nav>
<ul id="info-navi>
  ...    
</ul>
...

目前，我通过 jQuery 解决了这个问题，并为每个触发器添加了单击事件。像这样...

...
$(".trigger.menu1").click(function() {
  ...
  $("#main-navi").slideDown();
});
$(".trigger.menu2").click(function() {
  ...
  $("#info-navi").slideDown();
  ...
});
...

这工作得很好，但我想使用它更容易，并且不需要那么多代码。是否可以只获取 .trigger 的一个事件并将其引用到类以触发菜单向下滑动？

我尝试过类似的方法，但它不起作用:

if ($this.hasClass("menu1")) {
  $("#main-navi").slideDown();
} else {
  $("#info-navi").slideDown();
}

有办法让它工作吗？

问候，马库斯

Answer 1

你的问题已经解决了。尽管还有其他可能的解决方案，但此代码非常适合您的目的:

$(".trigger").on("click", function(e){
  e.preventDefault();

  if ($this.hasClass("menu1")) {
    $("#main-navi").slideDown();
  } else {
    $("#info-navi").slideDown();
  }
});//.trigger click