jQuery删除.click上的类

Question

这是我的HTML:

<a href="#">Read more</a>

<div class="moreDetails">
  <p class="additionalText">Some text help here, random length.</p>
  <p class="author">
    <span class="bolder"><a href="minidashboard.php?user_url=http://url.people/1332517">Name</a>
    </span>
  </p>
<div class="replies">
  <span>
    <a href="topic.php?id=http://url/topics/1049198">1</a>
  </span>
</div>

然后我使用jQuery在.additionalTextdiv的文本超过36个字符时为div 添加一个类.

jQuery的:

$('.moreDetails p.additionalText').filter(function () {
  if ($(this).text().length > 32) {
    $(this).addClass('trim');
  }
});

我现在想要的<a href="#">Read more</a>是点击.trim要删除的类并显示内容.

.trim 将段落设置为固定高度,溢出设置为隐藏.

Answer 1

你可以给该链接一个类,如下所示:

<a class="readMore" href="#">Read more</a>

然后添加一个单击处理程序,如下所示:

$("a.readMore").click(function() {
  $(this).next().find('.additionalText').removeClass('trim');
});

这通过找到<div>相对于<a>via .next()和.find().如果在您发布的代码<div>中没有立即执行<a>此类操作,则可能需要进行一些调整,例如,如果中间存在元素,但它们仍然是您需要的兄弟节点.nextAll('.moreDetails:first')而不是.next().