javascript - 省略号 chop 长文本

Question

我正在使用省略号概念来 chop 我的 HTML 中的长文本。我已成功 chop 句子，但“...”不会出现在我的 HTML 中。我将以下内容用于 css

输出似乎很好.. 即，用于测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试输出是测试测试测试当我真的想要它作为测试测试测试...

<div style="text-align:left; line-height: 20px; white-space: nowrap;
            overflow: hidden; text-overflow: ellipsis; width: 99%;
            display : block;"> 

Answer 1

我不确定你在问什么，或者你看到了什么，但只有当容器中没有足够的空间时，文本才会被 chop 。例如:

<style type="text/css">
div {
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    width: 100px;
}
</style>
<div> 
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

http://jsfiddle.net/jS7ea/

这里我将 div 的宽度限制为 100px，它只显示:

Lorem ipsu...

在您的示例中，您有 99% 的宽度，因此您只会在宽度小于实际内容宽度时看到 chop (尝试调整浏览器窗口的大小以进行检查)。