jquery - 菜单切换如果单击则添加间距(边距)

Question

知道为什么我的代码不能按预期工作吗？如果我在移动导航切换时点击它前两次，它可以正常工作，但第三次它不会按照我想要的方式添加边距。

jQuery(document).ready(function($){
  $("#site-navigation.main-navigation").click(function(){
    $("#page").css("margin-top", "285px");
  });

  $("#site-navigation.main-navigation.toggled").click(function(){
    $("#page").css("margin-top", "0px");
  });
});

Answer 1

当#site-navigation.main-navigation具有“.toggle”类时，您的两个事件会同时触发。那不是你的本意。此代码将执行您想要的操作。

jQuery(document).ready(function($){
    $("#site-navigation.main-navigation").click(function(){
        if ( $(this).hasClass('toggled') ) {
            $("#page").css("margin-top", "0px");
        } else {
            $("#page").css("margin-top", "285px");
        }
    });
});