我无法在课程之间切换答案

【问题标题】：I am not able to toggle between classes我无法在课程之间切换
【发布时间】：2015-11-02 15:48:38
【问题描述】：

HTML 代码

<template name="pI">
  <p class="bucket">
    <li class= "contentMain">{{{content}}}</li>
    <li><a href="#" class= "expandOrCollapse">(...)</a></li>
  </p>
</template>

JS代码

    Template.pI.events({
      'click .expandOrCollapse':function(event){
       event.preventDefault();
       $(event.target).closest().toggleClass("contentMain Big");
      }
  });

CSS 代码

.contentMain{
    position: relative;
    overflow: hidden;
    height: 60px;
    top: -15px;
    font-family: Palatino Linotype, Georgia, Verdana, sans-serif;
}

.Big{
    position: relative;
    height: auto;
    top: -15px;
    font-family: Palatino Linotype, Georgia, Verdana, sans-serif;
}

我希望当当前类为“contentMain”时单击“expandOrCollapse”时“contentMain”类切换为“Big”，当我单击“expandOrCollapse”时我希望“Big”类切换为“contentMain”当前班级为“大”时。我认为我在 JS 代码方面没有犯任何错误。任何帮助和建议将不胜感激

【问题讨论】：

标签： javascript html css meteor

【解决方案1】：

因为您要查找的元素不是被点击元素的祖先，而是被点击元素的父元素的上一个兄弟

$(event.target).parent().prev().toggleClass("contentMain Big");

closest()方法用于查找匹配选择器的第一个祖先元素

【讨论】：

非常感谢。你的回答解决了我的问题。非常感谢
@SujoyDe，如果这回答了您的问题，请接受回答