Javascript 通过类处理两次滑动/向下

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

我的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>
...

这很好，但我想更容易地使用它，并且不需要太多代码。难道不可能只获取.trigger的一个事件并将其引用到类以触发菜单向下滑动吗

我试过这样的东西，但不起作用：

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

有没有办法让它工作起来

问候,，

---

马库斯你已经解决了你的问题。尽管有其他可能的解决方案，但此代码对于您的目的来说非常有效：

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

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

---

你已经解决了你的问题。尽管有其他可能的解决方案，但此代码对于您的目的来说非常有效：

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

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

---

您正朝着正确的方向前进，但代码中有一个小的语法错误。试试这个：

$('.trigger').on('click', function(){
    var isMenu1 = $(this).hasClass('menu1');
    if(isMenu1){
        $("#main-navi").slideDown();
    } else {
        $("#info-navi").slideDown();
    }
});

---

$此

不正确，应该是

$（此）

您正朝着正确的方向前进，但代码中有一个小语法错误。试试这个：

$('.trigger').on('click', function(){
    var isMenu1 = $(this).hasClass('menu1');
    if(isMenu1){
        $("#main-navi").slideDown();
    } else {
        $("#info-navi").slideDown();
    }
});

---

$this

不正确，应该是

$（this）

您可以使用

HTML5

数据-*

属性来实现这一点：

$（函数（）{
$（'.trigger'）。单击（函数（e）{
e、 预防默认值（）；
$（'#'+$（this.attr（'data-target'））.slideToggle（）；
});
});

菜单开启器1
菜单开启器2
...
菜单幻灯片1

菜单幻灯片2
您可以使用
HTML5
数据-*
属性来实现这一点：


$（函数（）{
$（'.trigger'）。单击（函数（e）{
e、 预防默认值（）；
$（'#'+$（this.attr（'data-target'））.slideToggle（）；
});
});

菜单开启器1
菜单开启器2
...
菜单幻灯片1

菜单幻灯片2
这可能会对您有所帮助

var clickedItem = $(".foo").find('div');

clickedItem.click(function(e){
    e.prventDefault();
    if($(this).hasClass('menu1')){
        $("#main-navi").slideDown();
    }else{
        $("#info-navi").slideDown();
    }
});

这可能对你有帮助

var clickedItem = $(".foo").find('div');

clickedItem.click(function(e){
    e.prventDefault();
    if($(this).hasClass('menu1')){
        $("#main-navi").slideDown();
    }else{
        $("#info-navi").slideDown();
    }
});

为什么不使用slideToggle（）jquery函数呢？
您可以在这里找到帮助。
为什么不使用slideToggle（）jquery函数？
你可以在这里找到帮助。
嗨，你能把它放在提琴或片段中，这样我就可以看到实际发生的事情……谢谢，你能把它放在提琴或片段中，这样我就可以看到实际发生的事情……谢谢，我不用它，因为当第一个向下滑动时，第二个必须向上滑动。不能使用它，因为当第一个向下滑动时，第二个必须向上滑动。