0

我有一个非常大的 900 多行的 html 表。我通过循环遍历行并根据过滤器的值隐藏/显示行来启用过滤。

这就是问题所在。当我隐藏/显示 500 多行时,当浏览器忙于回流时,页面变得完全没有响应。我曾尝试在过滤、克隆表格然后替换表格等之前隐藏表格。但无响应仍然是一个问题,因为它阻止了我在浏览器重绘时获得“动画”加载图像。

分页不是一种选择,懒惰滚动也不是。

这是循环:

var rows = null;
$("#mavis-filters").find("input:checkbox").on("click", function() {
   var id, i;      
   if (!rows) {
      rows = document.getElementById("taskOverview").querySelectorAll("tr");
   }
   id = this.id; 
   i  = rows.length;

   while (i--) {
      var row = rows[i];
      if (row.dataset.project === id) {
         row.classList.toggle("row-hidden");
      }
   }

});
4

1 回答 1

0

使用渐进式渲染来解决此问题。以下是如何在每个浏览器中应用它:

于 2012-09-25T18:40:26.573 回答