如何在文本中添加省略号答案

【问题标题】：How Do I Add Ellipses to Text如何在文本中添加省略号
【发布时间】：2015-01-08 09:36:42
【问题描述】：

我正在尝试创建一个函数，该函数将获取元素的文本，截断超过 80 个字符，并在必要时添加省略号。到目前为止，这是我的代码：

var maxLength = 80;
function shorten(element) {
  var text = $('#' + element).text();
  var ret = text;
  if (text.length > maxLength) {
    text = text.substr(0,maxLength-3) + "...";
  }
$('#' + element).text(text);
}
shorten('slide1');

因此，该函数应该获取元素，从末尾删除多余的文本，添加一个省略号，然后用我刚刚创建的新字符串替换元素中的旧文本。

当我运行该函数时，我没有收到任何错误，但它实际上并没有按应有的方式截断文本。这是为什么呢？

【问题讨论】：

在这里工作正常：jsfiddle.net/j5eLdwtt。你确定id 是正确的吗？
只是一个小点，但您应该使用“…”而不是“...”，这是省略号的实际 HTML 代码。
这里有一篇文章，介绍了一些使用省略号的不同技术：html5hub.com/ellipse-my-text
一般来说，省略号用于表示“更多的东西”但“没有足够的空间”。问题是它们在删除信息时仍然占用空间。这是我更喜欢在这些情况下使用的另一种解决方案——codepen.io/run-time/pen/FxpID

标签： javascript jquery ellipsis

【解决方案1】：

var text = "Some Text Goes Here. La La La La!";
var textLength = 10; // Number of characters to cut off after

function shorten(text, textLength){
    if(text.length > textLength){
        text = text.substring(0, textLength) + '&hellip;';
    }
    return text;
}

var shortText = shorten(text, textLength);

另外，使用省略号的 HTML 字符比使用三个句点更好。

我添加了一个 Codepen，显示代码工作。此外，我添加了一个函数spaceShorten，它将在最后一次出现小于提供的长度的空格处拆分您的文本，因此您不会在单词中间拆分文本。

http://codepen.io/supah_frank/pen/EaYzNz

【讨论】：