Question

我有一个div，其中包含可变数量的文本。 div具有设定的高度，如果文本超过该高度，我想创建一个“阅读更多”链接。

我可以计算文本的长度，例如：

$(".longdesc").each(function() {
    var count = $(this).text().length
    console.log(count); 

    if(count > 100){
      //Replace additional characters with " ...Read More"
    };

});

但我不确定如何用“...阅读更多”替换第100个字符后面的所有字符。

有人知道如何解决这个问题吗？

Answer 1

if(count > 100){
    $(this).text($(this).text().substring(0, 100) + " ...Read More");
};

Answer 2

if (count > 100) {
    $(this).text($(this).text().substring(0, 100) + ' ...Read More');
}

Answer 3

尝试

$(".longdesc").text(function(idx, text) {
    return text.length > 100 ? text.substring(0, 100) + '...Read More' : text;
});

如果你想要一个链接

$(".longdesc").html(function(idx, html) {
    return html.length > 100 ? html.substring(0, 100) + '<a href="#">...Read More</a>' : html;
});

Answer 4

您可以像这样更新整个div的HTML：

if (count > 100){
    var newText = $(this).text().substring(0,100);
    newText += "<a href='#'>Read More</a>";
    $(this).html(newText);
}

Answer 5

使用切片：

text = text.slice(0, 100) + (text.slice(100)? "... Read More" : "");

使用Jquery替换第n个字符后的所有字符

5 个答案: