jquery - toggleClass 不适用于基础

Question

我在使用 Zurb 基础的页面上的 css 页面上有这个类。

.brandingOpen{
height:2044px;

}

我有一个 id 是的按钮 #zoomBranding，到目前为止，我已经试过了，但没有任何结果。

$("zoomBranding").click(function(){

$("#branding").toggleClass("brandingOpen");


}
);

根本不工作，如果我发出警报，这很好用，但 toggleClass 不行。

到目前为止，我已经尝试过结果但只有一次:

$(document).ready(function(){
$("#zoomBranding").click(function(){

    $(this).toggleClass( function(){
    $("#branding").css("height", "2044px");
    $(this).addClass("fi-zoom-out");
    $(this).click( function(){
        $("#branding").css("height", "1044px");

    });

    }
    );


}
);
}
);

我不能在#branding 中使用类，即使使用 .addClass，所以如果有人知道我做错了什么，请帮助我。

使用已经包含在 Foundation 4 中的查询版本，甚至尝试在所有内容的顶部使用 jquery-migrate，都是相同的结果。

这是#branding 的CSS。

#branding{
height:1044px;
overflow:hidden;
 -webkit-transition: height 0.5s linear;
  -moz-transition: height 0.5s linear;
  transition: height 0.5s linear;


}

.brandingOpen{
    height:2044px;
}

Answer 1

经过一些研究，我终于明白了，出于某种奇怪的原因，基金会不会在 id #branding 上使用 toggleClass，而是创建一个类，然后我交换类，我将 e 用于单击函数中的事件现在正在工作，这是代码

$("#zoomBranding").click(function(e){
    e.preventDefault();
    $(".closedNow").toggleClass("brandingOpen");
    $(this).toggleClass("fi-zoom-out");


}
);