<p>这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文这是一个P标签,点击展开查看全文</p>
给p标签加上长度宽度等样式
p{
width:300px;
height:100px;
text-indent:2em;
line-height:150%;
margin:5px 0 0;
}
p a{
color:#FDCD3D;
}
以下是jquery部分;
<script type="text/javascript">
$(function(){
$("p").each(function(){
var maxwidth=60;//设置最多显示的字数
var text=$(this).text();
if($(this).text().length>maxwidth){
$(this).text($(this).text().substring(0,maxwidth));
$(this).html($(this).html()+"..."+"<a href='###'> 点击展开</a>");//如果字数超过最大字数,超出部分用...代替,并且在后面加上点击展开的链接;
};
$(this).find("a").click(function(){
$(this).parent().text(text);//点击“点击展开”,展开全文
})
})
})
</script>