有没有人有一个更复杂的解决方案/库,用JavaScript截断字符串,并在末尾放一个省略号,比明显的一个:
if (string.length > 25) {
string = string.substring(0, 24) + "...";
}
有没有人有一个更复杂的解决方案/库,用JavaScript截断字符串,并在末尾放一个省略号,比明显的一个:
if (string.length > 25) {
string = string.substring(0, 24) + "...";
}
当前回答
使用以下代码
function trancateTitle (title) {
var length = 10;
if (title.length > length) {
title = title.substring(0, length)+'...';
}
return title;
}
其他回答
我对Kooilnc的解决方案投了赞成票。非常好的紧凑解决方案。有一个小的边缘情况,我想解决。如果有人出于某种原因输入了一个很长的字符序列,它不会被截断:
function truncate(str, n, useWordBoundary) {
var singular, tooLong = str.length > n;
useWordBoundary = useWordBoundary || true;
// Edge case where someone enters a ridiculously long string.
str = tooLong ? str.substr(0, n-1) : str;
singular = (str.search(/\s/) === -1) ? true : false;
if(!singular) {
str = useWordBoundary && tooLong ? str.substr(0, str.lastIndexOf(' ')) : str;
}
return tooLong ? str + '…' : str;
}
我不确定这是否算聪明,但它简洁明了:
truncateStringToLength (string, length) {
return (string.length > length)
? `${string.substring(0, length)} …`
: string
}
……然后:
truncateStringToLength('Lorem ipsum dolor sit amet, consetetur sadipscing', 20)
Text-overflow:省略号是您需要的属性。有了这个和一个溢出:隐藏在一个特定的宽度,超过它的所有东西将在最后得到三个周期的效果……不要忘记添加空格:nowrap或文本将被放入多行。
.wrap{
text-overflow: ellipsis
white-space: nowrap;
overflow: hidden;
width:"your desired width";
}
<p class="wrap">The string to be cut</p>
如果使用Ext.js,可以使用Ext.util.Format.ellipsis函数。
所有现代浏览器现在都支持一个简单的CSS解决方案,当一行文本超过可用宽度时自动添加省略号:
p {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
(请注意,这需要以某种方式限制元素的宽度,以便产生任何效果。)
基于https://css-tricks.com/snippets/css/truncate-string-with-ellipsis/。
应该注意的是,这种方法并不基于字符的数量进行限制。如果需要允许多行文本,它也不能工作。