Question

我知道有很多截断脚本，但由于我正在处理的cms的集成问题，我无法使用大部分脚本。

基本上我必须这样做：

获取div内的字符数
如果count超过一定数量（比如10个字符），div中的文本应该被截断并在末尾附加“...”。

在这里javascript非常糟糕是我蹩脚的非工作尝试：

if ($('div.text').val().length > 10) {

   //     

   ($('div.text').append('...');

}

有人可以帮忙吗？

Answer 1

if ($('div.text').text().length > 10)

或

if ($('div.text').html().length > 10)

div元素没有val（）返回的“value”，但它们有文本或html

然后您可能希望截断文本，如

var text = $('div.text').text();
text = text.substr(0,10) + '...';
$('div.text').text(text);

Answer 2

您正在寻找CSS属性text-overflow: ellipsis。大多数浏览器（甚至IE7 +）都支持此功能，但Firefox仅支持版本7.对于较旧的浏览器支持，您可以使用一些现有的jQuery plugins。

Answer 3

您可以使用以下内容：

$('div.text').each(function() {
    var maxchars = 250;
    var seperator = '...';

    if ($(this).text().length > (maxchars - seperator.length)) {
        $(this).text($(this).text().substr(0, maxchars-seperator.length) + seperator);
    }
});

Live example.

Answer 4

您可以将函数传递给.text()方法来执行字符串操作，如下所示：

$('div.text').text(function(i, text) {
    var t = $.trim(text);
    if (t.length > 10) {
        return $.trim(t).substring(0, 10) + "...";
    }
    return t;
});

jsfiddle上的代码示例。

Answer 5

您可以执行以下操作：

$("div.text").each(function() {
    var $this = $(this);
    var text = $this.text();
    if (text.length > 10) {
        $this.text(text.substr(0, 7) + "...");
    }
}

Answer 6

var string_limit = 10;

if ($('div.text').text().length > string_limit )
    $('div.text').text($('div.text').text().substring(0, string_limit -1) + '...');
}

这将检查您在string_limit中指定的长度限制。如果它太长，它会将文本缩小到有限的长度（不考虑单词边框，标点符号等 - 仅限长度），添加省略号，并将内容设置为缩短版本。

Answer 7

感谢您提出问题和答案。我将此代码用于多重标题，这对我有所帮助：

$('span.title-cut').each(function() {
        var title = $(this).text();
        if (title.length > 10) {
        title = title.substr(0, 10) + '...';    
        }
        $(this).text(title);
     });

Answer 8

如果您不想在单词中间切断，请执行以下操作：

  if ($("div.text").text().length > 10) {
    var ttext = $("div.text").text().substr(0, 10);
    ttext = ttext.substr(0, ttext.lastIndexOf(" "))  + '...';
    $("div.text").text(ttext);
  }

当div中的文本到达jQuery中的某些字符时，如何在文本内部剪切文本？

8 个答案: