Question

我正在使用具有动态内容的可排序表格为公司构建HR模块。完成项目后，客户端要求使表垂直调整大小。我将 jQuery UI resizable（）应用到主表所包含的div中。它在 Safari 和 Chrome 中运行得非常好，但是当在Firefox或IE中调整包装div的大小时，表的高度保持不变，并且不会扩展到div的维度

简化标记如下所示：

<div id="list">
    <div class="table-container">
        <table>
            (blablabla, this is a sortable table with clickable th's and about 10 columns)
        </table>
    </div>
</div>

样式是：

#list {
    width: 1150px;
    height: 180px;
    float: left;
    overflow: hidden;
    border: 1px solid #aeaeae;
}

#list .table-container {
    width: 1145px;
    height: 175px;
}

#list table {
    width: 100%;
    height: 100%;
    float: left;
}

#list table td {
    height: 20px;
    vertical-align: middle;
}

我尝试对每个元素使用各种溢出，位置和显示值，但结果并没有更好。 jQuery部分是：

$(document).ready(function() {
    $("#list .table-container").resizable({ alsoResize: "#list", handles: "s" });
});

Firefox / IE确实存在这样的问题，或者我做错了什么？

Answer 1

在Firefox 9.0.1中测试您的代码。找不到问题。

当div重新调整大小时，表高度确实发生了变化。

我发现该表可以在Firefox，IE和Chrome上正确调整大小。

我认为FF或IE没有任何问题。猜猜代码中的其他内容正在影响它。

Firefox和IE中的jQuery UI可调整大小的错误（？）

1 个答案: