在dialogresize事件上调整jQuery对话框内容的大小

Question

在jQuery对话框'dialogresize'事件期间设置内容div的高度时，div的高度不变。

参见示例：http://jsfiddle.net

使用

<div id='myDialog'>
   <p>some text</p>
   <div id='resizeToParent' style='overflow: scroll'>
        <div style="background: #ffc; width: 100px; height: 200px;"></div>
   </div>
<div>

我希望'resizeToParent'div占用对话框中剩余可用空间的100％。去做这个;我将一个函数绑定到dialogresize（并作为副作用显示div的高度和最里面的div内的父级）并设置div的高度。

 $('#myDialog').bind("dialogresize", function (event, ui) {
 $('#myDialog #resizeToParent')
      .css('height', $('#myDialog').css('height') - 200);

然而，'resizeToParent'div的高度不会改变!!我做错了什么？

Answer 1

检查这个小提琴：http://jsfiddle.net/S3FQv/

解决方案：使用.height()代替.css('height')来读取父级的计算高度。