在追加HTML時增加高度

我正在使用phonegap（build），並且在div容器內添加可變數量的div時出現問題，因爲我期望容器相應地增加其高度，但事實並非如此。在追加HTML時增加高度

我試過這個把戲沒有成功。我也嘗試了不同的溢出和高度：自動組合也沒有成功。

我現在正在努力增加容器高度動態，但是，老實說，我非常確定必須有一個更優雅的方式來做到這一點（我的意思是，這個容器可能在一些其他容器div內，等等，我無法想象我每次需要這種行爲時都必須爲它們中的每一個添加此代碼）。

你們如何處理這個問題（我想真的很常見）？

編輯：

我發現基於丹尼爾的回答的解決方案。下面是我如何處理它：

我有三個div容器和兒童的div的可變數量的清單工作：

「頁」分區。包含：
- 「content」div。包含：
  - 「categories」div。包含：
    - 孩子可變數量的div

（我很抱歉它是讓我瘋添加代碼正確，所以我將它作爲一個圖像）

電子xplanation是：

我定義一些變量來三個div容器原來的高度，所以以後我可以添加他們所需的額外高度取決於許多孩子的div如何包括在內。
我檢查它們的值是否爲空，因此我只在第一次給它們賦值，所以每次用戶進入頁面時都不會保持增加高度。
每個小孩的div都是40px高，所以我把它加到一個變量中，以累計總高度的增加。

最後，我更新容器的高度，我看到了整個內容。

無論如何，我的疑問是：每次我必須使用動態高度工作時，真的有必要這樣做嗎？
我很難想象沒有其他方法可以讓容器相應地增加其高度的動態內容。

有人能幫我理解嗎？

來源

2012-12-19 Iván Pallarés

DIV元素會自動擴大，以填補他們的內容，除非它有'overflow'或'height'集，你的國家，你都試過了。因此，另一件要檢查的事情是確保動態元素不是'位置'或'浮動'的，這將使它們脫離容器的上下文。 – Quantastical

請提供一個代碼示例！ –

當你描述你要添加div標籤到另一個div標籤是這樣的：

<div id="container"> 
    <div></div> 
    <div></div> 
    <div></div> 
    test 
</div>

額外的div標籤不附加高度來的#container的補充。

如果這是你在做什麼，你不會得到額外的高度。

如果你想在#container中加載更多的高度，你可以使用許多不同的方法。

使用jQuery

$("#container").css("height", "100px");

使用CSS
```
#container { 
    height: 100px; 
} 
```

如果你想更高度增加一個div＃容器，你可以做到以下幾點。

$("#container").click(function() { 
    var height = $("#container").height(); 
    height = height + 10; 
    $("#container").css({"height": height+"px"}); 
    /* do more here if you want :) */ 
}); 


<div id="container" style="background-color: red;"> 
    test 
</div>

來源

2012-12-20 01:25:52 Daniel

好吧，我通過手動增加容器的高度來處理它，具體取決於我添加的div的數量。這工作得很好，因爲我知道每個div的高度。現在，我發現自己處於另一個侷限之中。在另一種觀點中，高度並不會影響固定高度的數量，而是可能會有10或10萬字的文字。我嘗試在添加文本後立即檢索包含文本的div的高度，但結果爲0（我認爲它的高度增加尚未生效）。我怎樣才能在這種情況下更新高度？ –

在追加HTML時增加高度

回答

相關問題