gpt4 book ai didi

javascript - 从表中删除行时,剩余的行向上/向下移动

转载 作者:行者123 更新时间:2023-12-02 19:48:27 25 4
gpt4 key购买 nike

从表中删除行时遇到问题。
这是我使用的JS代码,如果有帮助的话。

function rem(el) {
while (el.nodeName !== "TR") {
el = el.parentNode;
}
el.parentNode.removeChild(el);
}

表格是这样构建的:

<tr>
<td>
<span onclick="rem(this);"></span>
</td>
</tr>

当表格超过浏览器的高度并且出现滚动条时,就会出现此问题。

  • 如果滚动条位于顶部并且我删除了一行,则剩余的行会向上流动。

  • 如果滚动条位于底部并且我删除了一行,则剩余的行会流下来。

  • 但是如果滚动条位于表格中间并且我删除了一行,剩余的行将向上流动,直到滚动条到达底部屏幕的。然后行将开始向下流动。我想表格向上或向下流动。没关系只要保持一致就可以。

由于我通过单击一行来删除它,因此表流必须保持一致。如果剩余的行以不同的方式移动,则用户很难预测下一行将是哪一行,是上面的行还是下面的行。

我的问题当然是“如何设置删除一行后剩余行的流动方式?”

如果我需要进一步解释该问题,请告诉我。

最佳答案

this is natural behavior自从:

  • 如果您位于顶部(顶部的滚动条),则删除一个元素并且行会向上移动。

  • 如果你在底部(底部滚动条),如果你删除元素,你当然会向上(因为没有什么可去的)

  • 如果您位于中间,它自然会删除元素并将内容向上移动(与情况 1 一样),如果您注意到更多内容需要向上移动,则适用情况 2。

现在,如果您的问题只是告诉用户删除项目后下一行是哪一行,我建议您使用颜色编码的行方案(此外,显示项目的 ID,例如任务 ID)任务)

另外,为了不用大量数据骚扰用户并且不知道接下来会发生什么,我建议您使用淡入淡出删除或上滑删除之类的东西,这样删除过程就不会突然(并且用户可以发现有东西被移除并取代了它的位置)。 jQueryUI 有很多这样的删除效果。

关于javascript - 从表中删除行时,剩余的行向上/向下移动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9599015/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com