当子div高度更改时，jQuery自动扩展父div [英] Jquery Auto expand Parent div when child div height is changed

问题描述

当内部#child可内容可编辑div超过父div的高度时，使父#container div自动调整高度的最简单方法是什么.

What is the easiest way to make the parent #container div automatically adjust height when the inner #child contenteditable div exceeds the height of the parent div.

这里是例子. http://jsfiddle.net/ULUJX/ 尝试在#child div内键入，直到高度超过父div.

Here's the example. http://jsfiddle.net/ULUJX/ Try to type inside the #child div until height exceeds the parent div.

推荐答案

我会跟踪keyup事件并观察#child的高度，例如:

I'd track keyup events and watch the height of #child, for example:

var $child = $('#child');

var $container       = $('#container');
var container_height = $container.height();
$container.resizable();

$child.keyup(function() {
    var h = $child.height();
    if(h > container_height) {
        $container.height(h);
        container_height = h;
    }
});

这是您的jsfiddle的更新版本: http://jsfiddle.net/ambiguous/ULUJX/10 /

Here's an updated version of your jsfiddle: http://jsfiddle.net/ambiguous/ULUJX/10/

如果您希望它也缩小，那么只需更改if并注意物品的初始尺寸即可.

If you want it to shrink as well then simply change the if and take care with the initial sizes of things.

这篇关于当子div高度更改时，jQuery自动扩展父div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！