backbone.js Javascript表格行显示/隐藏

cl25kdpy 于 2022-11-10 发布在 Java

关注(0)|答案(4)|浏览(144)

我用Javascript/Backbone创建了一个表。当使用模板显示行时，我有一个可见行和一个隐藏行。当我点击一个特定的表时，我希望它通过显示隐藏行来“展开”。我还使用了一个循环来创建表，这样所有的行都有相同的类和id。到目前为止，我用这个来展开和折叠行：

expandRow: function() {
    if (document.getElementById('hiddenText').style.display == 'none' ) {
        document.getElementById('hiddenText').style.display = '';
    }
    else if (document.getElementById('hiddenText').style.display == '') {
        document.getElementById('hiddenText').style.display = 'none';
    }

但是，无论我单击哪一行，此解决方案都只能打开和关闭同一个表行（最上面的一行）。我需要帮助来找到一个解决方案，以便只展开/折叠我单击的特定行。

backbone.js

来源：https://stackoverflow.com/questions/16473500/javascript-table-row-display-hide

4条答案

按热度按时间

eiee3dmh1#

ID对于页面必须是唯一的。如果它们不是唯一的，那么你的JavaScript将只选择第一个出现的地方，在本例中，第一行的ID为“hiddenText”。
您需要通过某种引用来选择所需的行。因此，也许在创建表的循环中，您可以在行id s中包含一个增量索引，然后通过该方法选择适当的行。

赞(0）回复(0）举报 2022-11-10

9avjhtql2#

我不知道您是如何构造视图的内部结构的。

expandRow: function() {
    if (this.$el.find("tr:hidden").length) {
        this.$el.find("tr:hidden").attr("display","");
    }
    else{
        $.el.find("tr:not(:hidden)").hide();
    }

上面的代码是用大量的假设编写的，所以它可能是错误的。

赞(0）回复(0）举报 2022-11-10

wooyq4lh3#

您的脚本在具有该ID的第一个元素处停止，因为它们不是唯一的。您需要让循环动态地创建唯一的ID。要实现这一点，我会使用整数计数器变量（var counter）将一个唯一的数字附加到ID的末尾。然后，我将修改if语句的条件，使其按类名而不是ID来获取（getElementsByClassName（'RowExpand '））并将它们全部存储在变量中（var hasClassRowExpand）.在onClick事件中，可以获取对所单击行的ID的引用，然后循环遍历hasClassRowExpand中的每个元素.当命中包含具有匹配ID的元素的索引时，根据显示属性的当前状态对其进行操作。

赞(0）回复(0）举报 2022-11-10

zf2sa74q4#

我使用的CSS类定义如下所示...

.hiddenRowTrue { display:none; }
.hiddenRowFalse { display:table-row; }

...使用JQuery toggleClass来翻转状态。

赞(0）回复(0）举报 2022-11-10

我来回答

backbone.js Javascript表格行显示/隐藏

4条答案

相关问题

热门标签

最新问答