>  기사  >  백엔드 개발  >  文字长度超过一定量,则截断展示“更多”点击查看剩余内容,不超不显示

文字长度超过一定量,则截断展示“更多”点击查看剩余内容,不超不显示

WBOY
WBOY원래의
2016-06-13 12:54:091478검색

文字长度超过一定量,则截断显示“更多”点击查看剩余内容,不超不显示
文字长度超过一定量,则截断显示“更多”点击查看剩余内容,不超不显示 js php实现的都可以有做过的高手请帮下忙


------解决方案--------------------
中文的话,用mbstring会比较好。
------解决方案--------------------
用php就能解决了。用for循环来截取字符串,条件判断的时候,判断字符是2字节(汉字)还是1字节(字母、数字)就可以了
------解决方案--------------------
function getsre($str,$len){
 $strlrn=strlen($str);
if($strlrn return $str;
}else{
rerurn substr($str,0,$len)."...";
}

}//我记得貌似是这样的
------解决方案--------------------
非中文的话好控制,比如这样。

        function limitwords($string, $limit = 250) {<br />
		if(strlen($string) < $limit) {return $string;}<br />
		$regex = "/(.{1,$limit})\b/";<br />
		preg_match($regex, $string, $matches);<br />
		return $matches[1].' more';<br />
	}


中文的话,用mbstring,而且之前最好要mb_convert_encoding(),统一一下编码。
------解决方案--------------------
用CSS加JS控制就可以了
首先CSS设置一个固定高度,超出隐藏,下面加个更多,点击的时候把这个高度设置为auto就可以了
------解决方案--------------------
css可以操作CSS属性啊,当点击更多的时候把css的高度设置为auto就显示了
------解决方案--------------------
我写个DEMO给你吧,很简单的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br />
<html xmlns="http://www.w3.org/1999/xhtml"><br />
<head><br />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br />
<title>无标题文档</title><br />
</head><br />
<body><br />
<div style="width:200px; height:200px; border:#999 1px solid; overflow:hidden; float:left;" id="more1">测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容</div><span onclick="document.getElementById('more1').style.height='auto'"> 显示更多</span><br />
</body><br />
</html>

------解决方案--------------------
不要用后台php来截取,那样的话还要考虑utf-8,麻烦。
直接完整数据传给前段,前段通过css设置,即可截断并用“更多”显示。
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사: php代码搅混求解 다음 기사: 登陆框兑现方法