Javascript Jquery的父div与之具有相同的宽度和高度'；s子元素

我有这个问题要解决好几个星期了，真的需要帮助

我有一个系统，用户可以选择一个模板，其中包含两种类型的区域。一个用于插入图像，一个用于插入文本。
每个模板可能有许多区域来插入图像，每个图像区域只是一个div，在800px-650px的有限区域内有自己的尺寸[width px-height px]

我将调用此div以接收图像

div.img

在

div.img

中有一个

input type=“file”

并抛出jquery.form.js插件，我可以在其中插入一个新图像

我将调用插入的图像

new.img

这个

new.img

包装在一个div

div.newImg

中，因为我必须有一个按钮来删除图像本身上方的图像

我使用的是jquery ui可拖动和可调整大小，因此可以调整

div.newImg

的大小并将其拖动到

div.img

中

以下是不同的元素：

div.img

->

div.newImg

->

new.img

+按钮删除

HTML

到目前为止，这是我努力做到的，但对我毫无帮助

if($('.child').width() > $('.child').height()){
    $('.imgh').height('100%');
    $('.imgh').width($('.imgh img').width());
}else{
    $('.imgh').width('100%');
    $('.imgh').height($('.imgh img').height());
}

通过使用

style=“width:inherit；height:inherit；”

，我成功地使

img.img\u集具有与其父项相同的维度

我需要的是一种方法，使
div.imgh
具有与其内部
img.img\u集相同的尺寸。像一个反向的
继承

更新

这段代码符合我的要求，但我的问题是，每次我调整大小时，它都会返回到我在初始化中定义的值：

if($('.child').width() > $('.child').height()){
    $('.imgh').height('100%');
    $('.imgh').width('auto');
}else{
    $('.imgh').width('100%');
    $('.imgh').height('auto');
}
if($('.imgh').width() > $('.imgh img').width()){
    $('.imgh').width($('.imgh img').width());
}

是否有一种方法可以使这种情况在每个
div.imgh
上只发生一次？
您可以使用.bind（）在每次发生更改时调整其大小

$('.imgh').bind('resize', FullWidthHeight); //Note: check the 'resize' event is relevant to imgh

function FullWidthHeight() {
    $('.imgh').css('height', img.img_set.height());
    $('.imgh').css('width', img.img_set.width());
}

浮动或绝对定位的块元素（高度和宽度设置为
auto
）将自动扩展到其内容。那么，您可能完全可以通过CSS实现这一点？我已经将其设置为自动，并在
div.child
内100%检查宽度，我似乎找不到您将其浮动或设置为
位置：绝对
的原因
div.imgh
可以定位为
absolute
，并且没有指定宽度。然后它会扩展到它的内容（子项）。是的，我有
.imgh{position:absolute；top:0；cursor:move；overflow:hidden；}
即使我没有设置宽度，它也会扩展100%。这不是在这把小提琴中完成的吗（我在
.imgh
中添加了红色背景，这样你可以更好地看到它的尺寸。
if($('.child').width() > $('.child').height()){
    $('.imgh').height('100%');
    $('.imgh').width('auto');
}else{
    $('.imgh').width('100%');
    $('.imgh').height('auto');
}
if($('.imgh').width() > $('.imgh img').width()){
    $('.imgh').width($('.imgh img').width());
}

$('.imgh').bind('resize', FullWidthHeight); //Note: check the 'resize' event is relevant to imgh

function FullWidthHeight() {
    $('.imgh').css('height', img.img_set.height());
    $('.imgh').css('width', img.img_set.width());
}