使用JavaScript更改表格中所有行的可見性

我有一張由轉發器填充的表格，其中許多行最初是隱藏的。我有一個錨點，它會觸發一個Javascript函數來更改網格中的所有行。功能如下：使用JavaScript更改表格中所有行的可見性

function ExpandAll() { 
     var elem = document.getElementById("repeaterTable"); 

     var rows = elem.rows; 

     for (var i = 1; i < rows.length; i++) { 
       rows.item(i).style.visibility = 'visible'; 
       rows.item(i).style.display = ''; 
     } 
    }

這一切工作，但是這個功能在網格大約需要12-13秒，通過〜450行循環。顯然我不能花這麼長時間。有沒有辦法更快地做到這一點？隱藏的行目前有：

style.visibility = 'hidden'; 
    style.display = 'none';

（所以爲什麼我要設置顯示爲「」）

編輯：這是一個有「父」與「子」行一個可摺疊的桌子。所有父行總是可見的，並且可以基於圖像點擊來擴展或摺疊子行（每父母大約3-15行）。我還提供了一次展開所有父行的錨點。請參閱下面的圖像，這是如何佈局：

alt text http://img85.imageshack.us/img85/9586/counties.png

此外，這是由ASP.NET中繼器定義填寫表格，因此，我沒有的「分組」子行的方式一起爲每個父行。實質上，表格無論如何都知道子行和父行之間沒有區別。

來源

2010-01-18 Kevin

如果您可以找到一種方法來區分父行和子行的標記，那麼您將有更多更容易的時間。要麼通過嵌套中繼器來實現多個'tbody'分組，要麼只是用不同的類名來標記它們... – Shog9 2010-01-18 20:53:09

假設只有兩個狀態「全部可見」和「預先選擇的組可見」，那麼就忘了關於單獨的行。

有一些諸如：

<table class="short" id="repeaterTable">

和

<tr class="longOnly">

然後（在你的樣式表）：

table.short tr.longOnly { display: none; }

而當你想擴展：

document.getElementById('repeaterTable').className = '';

來源

2010-01-18 20:06:20 Quentin

我必須嘗試一下。該表不只有兩個狀態，它是一個可摺疊的網格，因此用戶可以根據「父」行擴展行中的一些項目，或者可以單擊錨點以展開所有行。不過，我可以用它來解決後者。 – Kevin 2010-01-18 20:09:29

使用JavaScript更改表格中所有行的可見性

回答

相關問題