如何包装div的内容并在最后添加...？

Question

我有一个显示内容的div。我的要求是它必须显示超过10个字符

10 characters + '...'

我可以使用jQuery和PHP。

Answer 1

要限制显示的文本，特别是10个字符将是棘手的，因为您需要根据字体设置计算文本宽度。

如果您使用像em这样的单位，您将不需要打扰它，所显示的文字几乎与您想要的宽度相同。

有一个可编辑的例子：

http://jsfiddle.net/flaviocysne/88nLY/2/

基于这些网站的例子：

http://www.quirksmode.org/css/textoverflow.html

http://davidwalsh.name/css-ellipsis

Answer 2

如果您使用php，您可以使用函数substr（$ text，$ start，$ length），doc here，如下所示：

<?php

$test = "Lorem ipsum dolor sit amet consectetur adipisici";
// fonction to split the part of text if necessary
$result = strlen($test)>10 ? substr($test, 0, 10).'....': $test;
// to display the text: and don't check the length of string
echo $result;

所以在jQuery中，你有这样的文件：here那样：

$(document).ready(function() {
 let text = "Lorem ipsum dolor sit amet consectetur adipisici"
 let result = text.length > 10 ? text.substr(0, 10)+"..." : text;
 
 alert(result);
});

我希望它对你有所帮助