jquery slideToggle（）第一行显示

Question

我想使用slideToggle获取文本，就像read more的作品一样。更特别的是，第一行显示，当客户点击div时，全文显示。

<div class="group-one-row"> 
    <div class="row-header"> 
     <p class="group-regular-header"> 
      Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s 
     </p> 
    </div> 
</div> 

$('.row-header').on('click', function() { 
    $(this).parent().find('p').slideToggle(); 
}); 

通过此代码，我可以显示/隐藏全文，但我需要第一行始终显示。

Answer 1

我认为在这种情况下，你不应该使用.slideToggle()。尝试在<p>标签周围放置单个包装，并将此包装的max-height设置为与单个线条的线高相同的高度。然后溢出隐藏EN动画max-height约1000px（或使用JavaScript计算总高度）

Answer 2

为每行提供一个唯一的ID，然后确保您将在不是第一行的div中切换，或者如果第一行不可见，将在第一行中滑动。

$('.row-header').on('click', function() { 

    var p = $(this).parent().find('p'); 

    if($(p).attr('id') != 'idOfTheFirstRow' && $('p').is(':visible')) 
     $(p).slideToggle(); 
});