Jquery Show（）和隐藏的表行

我有一个表，其中有一些隐藏的行，还有一个可点击的按钮，可以显示这些隐藏的行。 问题是，当我使用链接时，行会显示出来，但主体不会更新其高度。（但当我打开并关闭chrome控制台时，它会更新）

css:

jquery：

$(document).on('click', 'a.openallrows', function(e) {
    $('.hide-row').show();
    e.preventDefault();
});

html

看得见的
这是隐藏的
-
--
---

我有很多隐藏的行。当它们全部显示出来时，它们与页脚重叠，这不是我想要的

更新

<div class="grid" style="width: 272.5px; left: 0px; top: 10px; position: absolute;">
     table is inside here  
</div>

桌子在这里面

表格位于具有绝对位置的网格内！位置由BlocksIt.js自动添加

试试下面的css代码

table{
height:auto !important;
}

---

如果将包含的div更改为：

<div class="grid" style="width: 272.5px;margin-top:10px;">
     table is inside here  
</div>

桌子在这里面

我有个好主意

您可以轻松地在其周围放置一个高度和宽度为100%的容器，然后将其高度和父元素的高度捕获到框中

每次打开新框时，将其与容器的高度进行比较，如果两者之间的边距变小，则添加到容器的高度

我做了一把小提琴。 我在高度上使用了增量代码。假设红色框是您的“隐藏行”类。 在这种情况下（因为时间紧迫），我假装添加40px（代表td的高度）。每当它增加时，如果在下面的添加中超过最大裕度，容器就会增加。所以我增加了容器的高度。我建议您的容器包含整个页面

$(".higher").click(function(){
    var allheight = $(".all").height() - 80;
    var red = $(".higher").height();
    $(".higher").css("height", "+=40px");
    if(red > allheight){
        $(".all").css("height", "+=40px");
    }
});

---

您可以根据需要在此部分中放置任意多的块列。

块与页脚重叠，因为它没有更新其高度值。 幸运的是，我能够找到一个不同的脚本来布置这些块。它有一个函数来调用刷新，这样它就不会与其他元素重叠

如果有人有过类似的问题，我建议你试试 它的功能与BlocksIt.js完全相同，甚至更多

---

这是我发现对我的项目非常必要的函数，Wookmark有

$（'.grid'）.trigger（'refreshWookmark'）刷新块。
您能发布一个完整的代码示例来复制该问题吗？你发布的内容还不够。A真的很好！你试过了吗？那些桌子是绝对定位的，还是浮动的？或者他们的父母是谁？@Dimitri你说得对。父div是绝对定位的。我更新了我的第一篇文章。BlocksIt.js将使用CSS绝对位置属性重新定位所选元素。它能够根据某些标准计算元素的顶部和左侧位置，如下所示：从左到右开始新块，然后将新块放在最短块下。@Kristjan Kirpu-我建议您在问题的某个地方提到Blockslt.js，以防进一步混淆。就你的问题而言，不幸的是，我不熟悉上面提到的库，但很可能它无法重新评估div的高度。可能是由于一个错误。您是否检查过控制台以查看是否抛出任何JS错误？没有抛出JS错误。我发现了其他一些BlocksIt.js脚本，它们修复了一些错误。我将试用它们，并尽快更新我的状态。表仍与页脚重叠。添加正文{height:auto！important；}
<div class="grid" style="width: 272.5px;margin-top:10px;">
     table is inside here  
</div>

$(".higher").click(function(){
    var allheight = $(".all").height() - 80;
    var red = $(".higher").height();
    $(".higher").css("height", "+=40px");
    if(red > allheight){
        $(".all").css("height", "+=40px");
    }
});