获取未显示元素的子元素的宽度/高度

问题描述：

我试图设置谷歌图表对象的宽度和高度作为容器div。要做到这一点，我需要设置一个对象属性：var options = {'width':$('#chart').width(),'height':$('#chart').height()}; 这实际上工作，但只有当$ .fn.width（）返回像素值。当元素被显示时会发生这种情况，但如果物品不是这样的话，则会发生这种情况由于我需要在元素隐藏时更新图表，我如何获得维度？这是一个小提琴，帮助你更好地理解我的问题（我的英语不好没有）：https://jsfiddle.net/Lj0daj27/获取未显示元素的子元素的宽度/高度

[类似的案件（http://stackoverflow.com/questions/1472303/jquery-get-width-of-element-when-not-visible-display-none） – user2970115

你的英语完全是精细。 –

@ user2970115我知道这种方法，但我的情况不同，因为我想知道其宽度的元素是隐藏元素的子元素，而不是隐藏自身。如果我想这样做，我应该设置隐藏和显示的可见性以阻止，但这对用户来说是可见的（对于很少的时间），因为我下面有很多内容。相反，我想这样做，保持内容不显示 –

答

document.getElementById('answer').innerHTML = document.getElementById('element').scrollHeight + "px tall!";

#element { 
 
    height: 200px; 
 
    width: 250px; 
 
    padding: 20px; 
 
    background: blue; 
 
    text-align: center; 
 
    color: white; 
 
    opacity: 0; 
 
}

<div id="element"> 
 
    This is my element! 
 
</div> 
 

 
<div id="answer"> 
 
    
 
</div>

我可能会考虑使用scrollHeight和scrollWidth属性来获取这些尺寸。它也适用于隐藏的元素。

http://www.w3schools.com/jsref/prop_element_scrollheight.asp

我试过scrollWidth，但它返回0元素不显示时... –

如果您使用'display：none'来隐藏元素，我不相信有一种方法可以找到它的尺寸。我建议通过'opacity'隐藏元素，或者以某种方式简单地显示元素，以便存储它的尺寸。这真的取决于你的元素的上下文。 –

获取未显示元素的子元素的宽度/高度

相关推荐