Jquery 在一个段落中找出句子或行的数量以便重新调整其边界?
我为我的新闻页面创建的jQuery函数有问题。 我想做的是在一定数量的文本中找到行/行/句子的数量(一些段落之间有Jquery 在一个段落中找出句子或行的数量以便重新调整其边界?,jquery,html,css,Jquery,Html,Css,我为我的新闻页面创建的jQuery函数有问题。 我想做的是在一定数量的文本中找到行/行/句子的数量(一些段落之间有断行)。 我之所以需要这样做,是为了能够重新调整文本区域的边框大小,以允许读取其余文本。 用户将看到一个特定大小的摘要段落,如果他们想阅读更多内容,请单击按钮,文本区域将打开以显示其余文本。 我需要行数乘以字体大小,这样我就可以将所有文本放入新的文本区域,如何找到这个数字(段落中的行数) 代码位于:或以下 -单击文本右下角的“V”以展开文本区域。 -单击文本右下角的“A”以缩小文本区
断行)。 我之所以需要这样做,是为了能够重新调整文本区域的边框大小,以允许读取其余文本。 用户将看到一个特定大小的摘要段落,如果他们想阅读更多内容,请单击按钮,文本区域将打开以显示其余文本。 我需要行数乘以字体大小,这样我就可以将所有文本放入新的文本区域,如何找到这个数字(段落中的行数) 代码位于:或以下 -单击文本右下角的“V”以展开文本区域。 -单击文本右下角的“A”以缩小文本区域 JQuery:
$(document).ready(function(){
$('.read_less').hide();
$('.read_more').click(function(){
//confirm($(this).parent().text().length/12);
$('.news_item').fadeOut('slow');
$(this).parents().fadeIn('slow');
$(this).hide();
$('.read_less').show('slow');
$(this).parent().animate({height:($(this).parent().text().length/50) *20 + 'px',width:'655px'},'slow');
//$('.bars2').show('slow');
//$('.bars').animate({width:'255px'},'slow');
//$('.bars2').animate({width:'255px'},'slow');
});
$('.read_less').click(function(){
$(this).parent().animate({height:'110px',width:'464px'},'slow');
$('.news_item').fadeIn('slow');
$('.read_less').hide();
$('.read_more').show();
});
});
我想创建这些新闻项,以便每个新闻项都能够定义自己的扩展空间,只允许阅读文本,并使文本紧密地适合文本区域,我的解决方案需要行数。但是我不确定如何找到这个数字。
此外,如果您有更好的建议,我可以如何纠正我的错误,并帮助我解决手头的任务,将不胜感激
提前谢谢 一种方法可能是取出div的
视线外
,然后除以它的行高
。这将为您提供行数
或者你可以使用javascript的函数,我认为它确实可以做到这一点。这个函数只是将每一行转换成一个矩形,然后我们就可以得到它的
长度和行数。我意识到找到行数是一种迂回的方法,只需将扩展框设置为.css('height','auto');单击“阅读更多”按钮后。
感谢所有尝试过的人提供的帮助。为什么不让文字包装完成它的设计目的呢?回答得很好。要扩展它,您还可以使用截断文本的新CSS3属性。@mattcurtis哪个属性?谢谢您的快速响应。我是一个jQuery程序员初学者,不确定我的代码(可能没有意义),但以下是我根据您的回答尝试的内容。再次感谢。我已尝试更改:'$(this.parent().animate({height:($(this.parent().text().length/50)*20+'px',width:'655px'},'slow');'对$(this.parent().animate({height:($(this.parent().getClientRects().length)*20+'px',width:'655px'},'slow');将行高
更改为行高
@Delrog如果他的答案解决了您的问题,您应该将其标记为答案。