在每個固定高度的段落的最後一行添加省略號，其中溢出-y隱藏

Question

我有大約10段描述文本，它具有固定高度並帶有文本溢出y：隱藏。

我已經添加了JQuery腳本來在'每個段落'的'最後一行'添加省略號。

但是該腳本僅適用於描述文本的第一段。 如何讓它適用於其他段落的文字？

<div class="description" style="height:85px; overflow-y:hidden;" itemprop="description"> 
    <a id="a" href="{{ product.url | within: collection }}" itemprop="url"> 
    {{ product.description| strip_html }} 
    </a> 
</div> 

<script> 
    var $p = $('.description #a'); 
    var divh = $('.description').height(); 
    while ($p.outerHeight() > divh) { 
    $p.text(function (index, text) { 
    return text.replace(/\W*\s(\S)*$/, '...'); 
    }); 
} 
</script> 

Answer 1

只是把它扔在一個循環。

$('.description #a').each(function() { 
    var $p = $(this); 
    var divh = $('.description').height(); 
    while ($p.outerHeight() > divh) { 
    $p.text(function (index, text) { 
     return text.replace(/\W*\s(\S)*$/, '...'); 
    }); 
    } 
}); 

這假設你所有的div都有相同的類，你的錨具有相同的id。如果你需要使它更通用只是做：

$('div a').each(function() { 
    //Rest of code here 
}); 

https://jsfiddle.net/mewcg3zo/1/