Jquery 如何巧妙地添加“quot；”&引用；在DIV中剪切文本之后？

我需要在产品图片旁边显示“存根”描述文本。但是如果它很长的话，我需要把它剪成3行高（或者如果描述只是一个简短的文本，那么就剪得更少）。但问题是文本的字段维度可能会有所不同。另一个问题是我必须在存根文本的末尾添加“…”

当前CSS：

.box {
    width: 100px;
    height: 50px;
    overflow:hidden;
}

Lorem ipsum dolor sit amet, 
consectetur adipiscing elit.
Donec in egestas diam, et

HTML：

<div class="box">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in egestas diam, et gravida ligula. Nullam fermentum eget purus consectetur semper. Morbi ut adipiscing purus. Sed lobortis nulla erat, pulvinar pharetra mauris porttitor sagittis. Morbi pellentesque dui quis tortor feugiat, eu malesuada dui faucibus. Integer magna nisi, cursus ac diam accumsan, hendrerit laoreet nibh. In commodo lorem massa, eget semper tellus cursus a. Proin sagittis consectetur sapien ut congue. Vivamus cursus tellus in pellentesque hendrerit. Curabitur placerat tincidunt porta. Nunc pulvinar odio at enim imperdiet vulputate.</div>

结果如下：

Lorem ipsum dolor sit amet, 
consectetur adipiscing elit.
Donec in egestas diam, et ...

---

你认为做这件事的好方法是什么，这意味着它在未来是灵活的/可扩展的？我可以使用HTML、CSS、JSP、Javascript和JQuery。但我无论如何都不能改变数据库中的数据。当然，在我向用户展示之前，我可以操作从数据库接收到的任何数据。

你可以使用一个很好的jQuery插件，请参见我还将与

适用于您的示例用法：

$('.box').trunk8();

---

我认为我的方式并不完美，但你只能在CSS中做到这一点：

#longText{
    width : 400px;  height : 200px; overflow: hidden; position : relative;
}

#longText:after{
    content: '...'; position: absolute; bottom: 0; right: 0;
}

---

在CSS3中，有一个名为

文本溢出的属性，它有一个属性
省略号
，在剪切文本的末尾添加“…”

不幸的是，一般来说，它只能在一条线上工作。
但作为回报，它非常简单，不需要Javascript和脚本

您可以查看我为您的示例制作的CSS代码，或者只使用以下CSS代码：

.box {
    width: 200px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

应该有一个jQuery插件。你可以看看类似的东西，比如：这可能会有帮助-@bramvanroyya，它可能会对我的项目的其他部分有所帮助。谢谢！：）@pandit的CSS代码很棒！我想我要用这个。可惜你没有把它作为一个答案，只是一个评论。：）非常感谢。这个也很棒！虽然我更喜欢本页中的其他CSS解决方案，但这也是一个很好的答案。为什么我一开始就不知道这个插件。。。嗯……trunc8是另一个简洁的JQuery解决方案，如果CSS解决方案让代码变得太复杂，我可能会尝试使用它。：）谢谢虽然你的方法“并不完美”，但你给了我灵感，让我用你的方法尝试其他东西。到目前为止，你的方法是最简单、最整洁、最干净的！谢谢不客气，我在stackoverflow中发现了一些相互干扰的东西，在
显示中使用
文本溢出
：webikit box
，但我担心与其他兄弟（如FF或IE）的兼容性