【发布时间】：2015-08-04 18:17:20
【问题描述】：
我使用 JS 和 AJAX 的组合在一个表中显示 14.5k+ 条数据记录。
从数据库中检索的数据被迭代并与“+=”连接。在for循环之后，使用$('#tableDiv').html(concatString);将字符串添加到表中
可以在点击时对列进行排序。如果显示超过 2k 条记录，则排序需要时间来执行，这种情况下它似乎会挂起几秒钟，然后显示排序记录。
除此之外，最后一列还有一个“+”号。单击时，我将添加一行带有文本字段的行，然后再次单击将其删除。当我单击“+”时，此行展开没有生命。我正在使用以下代码添加行。
$('.plusToggle').live("click", function() {
var row = $(this).closest("tr");
currentSection =id.split('&Id=')[0];
insertRow = "<tr id='notes,"+currentSection+"'><td class='col-md-1 text-center' >
<div class='form-group notes'>"
+ "<input class='form-control Summary' type='text' id='Summary,"+currentSection+"' placeholder='Summary' /><br/>"
+ "<textarea class='form-control Notes' rows='5' id='Notes,"+currentSection+"' ></textarea>"
+ "</div></td></tr>";
if(currentSection != previousSection) {
$(insertRow).insertAfter(row).hide();
$('#notes,'+currentSection).show("blind");
document.getElementById('Summary,'+currentSection).focus();
$('#notes,'+previousSection).hide(1000);
notesClicked = '';
$("#notes,"+previousSection).remove();
} else {
if(notesClicked) {
$(insertRow).insertAfter(row).hide();
$('#notes,'+currentSection).show("blind");
document.getElementById('Summary,'+currentSection).focus();
notesClicked = '';
} else {
$('#notes,'+currentSection).hide("blind");
notesClicked = 'TRUE';
}
}});
当我在 Chrome 中检查时，.show("blind") 行需要更长的时间来执行。分页和延迟加载效果很好，但我的高级权限只想要滚动 - 没有页面或动态加载。
如何在表格中显示 14.5k 条记录，同时让排序和行扩展功能顺利运行？
【问题讨论】：
-
听说过分页吗？？即使对于无休止的滚动，您也需要某种分页机制，这样就不需要一次处理所有数据。什么样的用户一次需要 14K 行数据？
-
@frenchie - 不，我没有听过或使用过寻呼。我会检查一下。显示所有 14k 记录是没有用的。它只会减慢页面速度。但是，这是唯一的选择。 :-/
标签： javascript jquery ajax string-concatenation