Question

我有一个巨大的HTML页面，主要是一种形式，大部分是这样的：

<FIELDSET id= '1'>
<TABLE>
  <TR> </TR>
</FIELDSET>
</TABLE>
   .
   .
   .
<FIELDSET id= 'n'>
<TABLE>
  <TR> </TR>
</TABLE>

字段集的数量是在服务器上动态生成的。

问题：在客户端，我想为这个巨大的页面做一个分页，所以只说，客户端每页出现3个字段集。我不想改变页面加载方式或当前正在提交表单。

Answer 1

你可以使用一些小技巧

$('fieldset')
document.querySelectorAll('fieldset')

将返回字段

为了只显示i .. i + 3个字段集，你可以使用

var i = 3

$('fieldset').hide().each(function ( index, el) {
   if (index >= i && index < i+3) $(el).show() 
})


var fieldsets = [].slice(document.querySelectorAll('fieldset'))


for (var index in fieldsets) {
    var display = index < i && index >= i+3 ? 'none' : ''
    fieldsets[index].style.display = display
}

Answer 2

如果在客户端进行分页（没有速度增加，负载减少等），分页将不会以任何方式帮助您（如果没有速度增加，减少负载等），但如果这是你想要的，你可以使用DOM操作。以下内容可能对您有用：

    var i=0,sets=document.getElementsByTagName('fieldset'),len=sets.length;
    for(;i<len;i+=3) {
        // wrap sets[i] through sets[i+2], as long as they exist, in a div
        // if i !== 0, hide or minimize the div
    }
    // add controls to unhide/unminimize each div

将一个大的HTML页面拆分为客户端的页面

2 个答案: