限制文字大小
阿新 • • 發佈:2020-12-23
實現這樣一個功能,比如限制文字20字,多餘的文字用省略號代替。“更多”定位在右下角
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.a {
width: 200px;
height: 40px;
position: relative;
background-color: pink;
}
.c {
position: absolute;
right: 0;
bottom: 0;
display: none;
}
</style>
</head>
<body>
<div class="a">
<div class="b">啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦來了</div>
<div class="c" >更多</div>
</div>
<script src="js/jquery-1.12.2.js"></script>
<script type="text/javascript">
$(function(){
$(".b").each(function(){
if($(this).text().length>20){
$(this).text($(this).text().substring(0,20));
$( this).html($(this).html()+'......');
$('.c').css({"display":"block"});
}
})
})
</script>
</body>
</html>