Question

我在css中使用overflow：hidden属性，当文本移出容器时会使文本被隐藏。

任何人都可以告诉我是否有办法捕捉整个文本的高度，包括溢出文本

也是。 height（）值只是返回容器的高度而不是溢出文本？

Answer 1

使用scrollHeight，请参阅documentation。

$('#id')[0].scrollHeight

Answer 2

Live demo

<强> JQuery的

$('document').ready(function(){
    $("#info").text("Width of real text: "+$('.real').css('width'));
    $("#info").html($("#info").html() + "<br/>Height of real text: "+$('.real').css('height'));

});

<强> HTML

<div class="overflow">
    <div class="real">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse non justo eget eros accumsan mattis. In a auctor magna, sit amet dapibus sapien. Mauris lectus justo, ornare eu pretium in, fringilla nec risus. Phasellus at risus dapibus, imperdiet tellus lacinia, feugiat risus. Nullam ultrices luctus ante, id aliquet eros. In iaculis elit ut hendrerit facilisis. Cras tristique non orci non sodales. Aliquam semper libero sed diam venenatis, imperdiet rhoncus augue eleifend. Nullam euismod mauris neque, ac semper erat posuere a. Nam a tortor commodo, adipiscing nisl vel, sollicitudin nisl. Suspendisse adipiscing laoreet neque sit amet tempor. 
    </div>
</div>

<div id="info"></div>

<强> CSS

.overflow{
    width:200px;
    height:100px;
    overflow:hidden;
}

.real{
    width:300px;
}

#info{
    background-color:gray;
    margin-top:15px;
}

使用javascript捕获溢出文本高度

2 个答案: