Jquery 隐藏两行后的文本

我有一段代码，隐藏了一行之后的文本。有没有办法修改它，使它隐藏在两行之后？它需要响应，因此设置固定的高度或宽度不是一个选项

拨弄

HTML

jQuery

$('#read_more').click(function(){
    $('#my_text').toggleClass('ellipsis');
});

---

通过计算行数来设置div的高度。例如，可以通过div height=（行高*2）来实现

演示

var style=$（'.ellipsis{height:'+（（parseInt（$（'.ellipsis'）.css（'line-height'））*2）+'px'）+'}）；
$（'html>head'）。追加（样式）；

---

您会注意到，我添加CSS是一种规则，而不是将其添加到元素本身。

通过计算行数来设置div的高度。例如，可以通过div height=（行高*2）来实现

演示

var style=$（'.ellipsis{height:'+（（parseInt（$（'.ellipsis'）.css（'line-height'））*2）+'px'）+'}）；
$（'html>head'）。追加（样式）；

---

您会注意到，我添加CSS是作为一项规则，而不是将其添加到元素本身。

看起来这正是您所需要的：@itdoesNetwork这依赖于固定的宽度/高度删除“空白”属性，并为您的“#我的_文本”提供一些“高度”。但是它不会显示被截断的点。@Atula谢谢，但是设置高度不是一个选项，因为我需要一个响应性强的解决方案，这使得这有点复杂。如果我能够设置一个高度，那么实现起来会非常简单。好的，如果你在这里找到一些帖子。看起来这就是你需要的：@itdoesnetwork这依赖于一个固定的宽度/高度删除“空白”属性，并为你的“#我的#文本”提供一些“高度”。但是它不会显示被截断的点。@Atula谢谢，但是设置高度不是一个选项，因为我需要一个响应性强的解决方案，这使得这有点复杂。如果我能够设置一个高度，它将非常容易实现。好的，如果你在这里找到一些帖子。

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}

#my_text {
    font-family:arial;
    color:#333;
    font-size:10px;
    width:80%;
}

$('#read_more').click(function(){
    $('#my_text').toggleClass('ellipsis');
});

var style = $('<style>.ellipsis { height: '+((parseInt($('.ellipsis').css('line-height')) * 2)+'px')+' }</style>');
$('html > head').append(style);