如果它太大,请将省略号添加到HTML文本

时间:2013-09-24 19:56:29

标签: javascript html css

如果字符串太大,有没有办法在字符串中添加省略号(三个点)?

例如。

自:

This is a very large sentence.

要:

This is a ve...

可以在服务器端使用PHP的wordwrap来完成,但当时很难获得渲染的大小,因此有更好的标准方法在客户端使用JavaScript,HTML或CSS来完成?

这里我附上了一张照片,以防万一你真的不知道我在说什么。

Example. ''

6 个答案:

答案 0 :(得分:12)

理想的方式是使用css text-overflow属性:

p {
  white-space: nowrap;
  width: 100%;                
  overflow: hidden;  /* "overflow" value must be different from "visible" */                
  text-overflow: ellipsis;
}

答案 1 :(得分:6)

这是一个PHP函数,可以执行您想要的操作,其中10是要保留的字符数:

function truncateString($string) {
    if (strlen($string) > 10) {
        $string = substr($string, 0, 10) . "...";
    }
    return $string;
}

echo truncateString("Short"); // Returns "Short."
echo truncateString("Long string is long."); // Returns "Long strin..."

这仅适用于使用PHP生成菜单项的情况。如果你想在客户端用Javascript和/或CSS做,你根本不会使用PHP。

答案 2 :(得分:3)

使用函数来完成此操作非常简单。

function limitstr($str,$maxlength=20,$additional="...")
{
    return (strlen($str)>$maxlength)? substr($str,0,$maxlength).$additional : $str;
}

答案 3 :(得分:3)

<强>的Javascript

str = "This is a very large sentence."

if(str.length>12){
  str = str.substring(0, 12)+"...";
  }

demo

答案 4 :(得分:1)

我想通过说“太大”你的意思是“不适合它的容器”。如果是,则解决方案位于CSS。它与PHPJavascript完全没有关系。

.your_element {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

答案 5 :(得分:-1)

If (string is > than 6) {
append three dots
} else {
leave untouched
}

php.net/strlen

php.net/substr

帮助我得出这个结论。