Question

我的项目http://inubia-projekt.dkonto.pl/product-category/sukienki/sukienki-wieczorowe/有一个链接

我想要实现的是，当您单击“ Czytajwięcej”时，文本将替换为“Zwińopis”。我还想在第二个跨度单击（“Zwińopis”）上附加功能，这将使文本再次变短。我是jquery和javascript的新手，所以我需要帮助。我编写的代码仅以一种方式扩展文本。

这是一个代码：

HTML：

<div id="read-more"><span>Czytaj więcej</span><span>Zwiń opis</span></div>

CSS：

#read-more span:last-child {
    display: none;
}

.visible {
    display: block !important;
}

.not-visible {
    display: none !important;
}

.visible-desc {
    max-height: 100% !important;
}

.term-description {
    max-height: 65px;
    overflow: hidden;
   margin-bottom: 20px
}

jQuery

jQuery(document).ready(function( $ ){
   $(function() {
  $("#read-more span:first-child").click(function() {
    $(".term-description").addClass('visible-desc');
    $("#read-more span:first-child").addClass('not-visible');
    $("#read-more span:last-child").addClass('visible');
  });
});
});

Answer 1

只需在您的Jquery中进行一些更改，而不是使用addClass / removeClass来使用toggleClass：

{{1}}

用于“阅读更多”产品类别描述的jQuery函数未按预期工作

1 个答案: