单行文本时：
用text-overflow:ellipsis属性来实现单行文本的溢出显示省略号(…)，但是部分浏览器还需要加宽度width属性。
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
但是这个属性并不支持多行文本溢出显示省略号，这里根据应用场景介绍几个方法来实现这样的效果。
WebKit浏览器或移动端的页面可以实现多行文本省略号；
在WebKit浏览器或移动端（绝大部分是WebKit内核的浏览器）的页面实现比较简单，可以直接使用WebKit的CSS扩展属性(WebKit是私有属性)-webkit-line-clamp ；
注意：这是一个 不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中。
-webkit-line-clamp用来限制在一个块元素显示的文本的行数。 为了实现该效果，它需要组合其他的WebKit属性。
常见结合属性：
display: -webkit-box;必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。-webkit-box-orient必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 。text-overflow: ellipsis;，可以用来多行文本的情况下，用省略号“…”隐藏超出范围的文本 。
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
这个属性比较合适WebKit浏览器或移动端（绝大部分是WebKit内核的）浏览器。
//页面加载之后,设置.样式.
＄(function(){
$(".textbox").each(function(){
//获取textbox当前对象的文本,如果长度大于25;
if($(this).text().length>25){
//获取textbox的值,进行截取。赋值给text变量保存.
var text=$(this).text().substring(0,25)+"...";
//重新为textbox赋值;
$(this).text(text);
}
});
});
下面是HTML代码:
<html>
<head>
<title>测试<title>
</head>
<textarea class="textbox">
这是很长的一段文本内容,测试是否能正常截取.这是很长的一段文本内容,测试是否能正常截取.这是很长的一段文本内容,测试是否能正常截取.这是很长的一段文本内容,测试是否能正常截取.
</textarea>
</html>
如何动态获取文本框还能输入几个字呢？
$(function(){
var numlength=10;
setInterval(
function(){
var text=$('textarea').val();
var num=$('.num').text();
$('.num').text(numlength-text.length)
}
,300)
})
下面是html代码：
<textarea class="textarea"> <!--这里输入文本--> </textarea> <div class="textnum">你好可以输入<span class="num">10</span>个字</div>
这里主要是运用到setInterval不间断的获取到textarea里的文本数量