Question

我点击了全部按钮，它将选中所有复选框。但是在我的显示页面上，我有30000个复选框，这使我在点击Check All按钮时没有响应页面。有人可以帮忙解决这个问题。

function js_select_all(btn,theForm){
   if (btn.value == "Check All")  {
       var checkval = "checked";
       if (js_one_row(theForm.circSelected)) {
           theForm.circSelected.checked = checkval;
       } else {
           for (var i=0; i < theForm.circSelected.length; i++){
               theForm.circSelected[i].checked = checkval;
           }
       }
       btn.value ="Uncheck All";
   }else {
       if (js_one_row(theForm.circSelected)) {
           theForm.circSelected.checked = false;
       } else {
           for (var i=0; i < theForm.circSelected.length; i++){
               theForm.circSelected[i].checked = false;
           }
       }
       btn.value = "Check All";
    }
}

soembody可以帮助我以最快的方式实现结果。我正在开发一个仅支持HTML，CSS和JS的webtoolkit。

Answer 1

将任务分解为更小的块，并在使用setTimeout

的短暂延迟后运行它们

这允许浏览器保持响应。据推测，复选框立即改变状态并不重要吗？用户可能会很高兴计算机正在打勾，即使需要一些时间，因为否则用户必须自己做。

这是一个示例，我们将其分成100个复选框的块，每个块以1000毫秒的间隔完成。

const chunkSize=100;
const intervalBetweenChunksMs = 1000;
for (var i=0; i < theForm.circSelected.length ; i+=chunkSize) { 
  console.log("Creating chunk starting at",i)
  setTimeout(function(start){for(var j=start; j<Math.min(i+chunkSize,33); j++) 
    { 
      console.log("Doing item number", j);
      theForm.circSelected[j].checked = checkval;

    }
  }(i),(1 + theForm.circSelected.length/chunkSize)*intervalBetweenChunksMs ) 
}

如果这原则上有效，您可能希望尝试更小的间隔，以便在合理的时间范围内完成检查的完整“波浪”。

我已输入“1+”，以便第一个块（从项目编号0开始）仅在一个间隔后发生。如果这在第一次可见更改之前引入了不可接受的延迟，则删除“1 +”。

单击“检查所有按钮”问题

1 个答案:

将任务分解为更小的块，并在使用setTimeout