Jquery Div显示文本的上半部分
我在MVC 5中的一个项目中工作，我有一个页面，我必须在其中显示一个项目的描述，该描述有时可能很长，因此我必须首先将其限制为500个字符，并放置一个“阅读更多”按钮，“阅读更多”按钮显示完整的描述 我正在使用Readmore.js来实现这一点。这对我来说很好，但是有一个小问题（CSS可能是）。当分辨率介于320和768之间时，会出现问题。最后一行显示为半文本。见下图 描述文本取自数据库，它有一个或多个段落包含在段落标记中 div的高度为195px 加价Jquery Div显示文本的上半部分,jquery,html,css,Jquery,Html,Css,我在MVC 5中的一个项目中工作，我有一个页面，我必须在其中显示一个项目的描述，该描述有时可能很长，因此我必须首先将其限制为500个字符，并放置一个“阅读更多”按钮，“阅读更多”按钮显示完整的描述 我正在使用Readmore.js来实现这一点。这对我来说很好，但是有一个小问题（CSS可能是）。当分辨率介于320和768之间时，会出现问题。最后一行显示为半文本。见下图 描述文本取自数据库，它有一个或多个段落包含在段落标记中 div的高度为195px 加价 <div class="float
<div class="float-left">
<h1 class="contentTile">
Description
</h1>
<div class="appDescription">
@Html.Raw(Model.Description)
</div>
<br />
<div class="buttonsContainer">
<a class="articleBtn float-right" href="javascript:void(0);" style="display:none">Read More</a>
</div>
</div>
描述
@Html.Raw（Model.Description）
var totalChars = 0;
var parg = $('.appDescription').find('p');
if (parg.length) {
$('.appDescription').find('p').each(function (index) {
totalChars += $(this).text().length;
});
} else {
totalChars = $('.appDescription').text().length;
}
if (totalChars >= 500) {
$('.appDescription').readmore({
moreLink: '<a class="articleBtn float-right" id="readmoreBtn" style="margin-top:10px;margin-bottom:15px" href="javascript:void(0);" >Read More</a>',
lessLink: '<a class="articleBtn float-right" id="showlessBtn" href="javascript:void(0);">Show Less</a>',
embedCSS: true,
collapsedHeight: 195,
blockCSS: 'width:auto;',
afterToggle: function () {
$('#showlessBtn').css({
'margin-top': '10px',
'margin-bottom': '15px'
});
}
});
}
var totalChars=0；
var parg=$（'.appDescription'）.find（'p'）；
if（平均长度）{
$（'.appDescription'）。查找（'p'）。每个（函数（索引）{
totalChars+=$（this）.text（）.length；
});
}否则{
totalChars=$（'.appDescription'）.text（）.length；
}
如果（总字符数>=500）{
$（'.appDescription'）.readmore({
moreLink:“，
莱斯林：“，
对,，
折叠高度：195，
blockCSS:“宽度：自动；”，
后记：函数（）{
$（'#showlesbtn'）.css({
“页边距顶部”：“10px”，
“页边距底部”：“15px”
});
}
});
}