亿条数据分页和选择下载：

一、后台提供：

（1）当前页所要展示的数据；

（2）当前页数、页面总数、所有页数据总条数；

二、静态页面：

（1）页面有按钮，包含“单选按钮”、“当前页全选按钮”、“所有页全选按钮”；

（2）页面有分页，包含“首页”、“上一页”、“下一页”、“尾页”、“跳转”；

（3）页面有功能，包含“下载”、“删除”；

三、前端应实现的需求和实现思路：

（1）初始化时，定义7个变量。“单选按钮”（实际上，这个不用定义）、“当前页全选按钮”、“所有页全选按钮”都置为false；“所有页全选等级”置0；“被选中项总数”置0；“已从服务器返回且被选中的项的ID所组成的数组”（简称：“已选ID数组”）置空；“已从服务器返回且被选中后，又没选中的项的ID所组成的数组”（简称：“没选ID数组”）置空；

（2）点击按钮。在“单选按钮”、“当前页全选按钮”、“所有页全选按钮”被点击任何一个后，记录所有被影响的数据。实现思路：

A、点击“单选按钮”。如果“单选按钮”点击后的状态是选中，那么先把该项的id放到“已选ID数组”、把该项的id从“没选ID数组”中移除、把“被选中项总数”加上1、把该“单选按钮”置为true；然后判断当前页数据的id是否都在“已选ID数组”里，如果有一项不在“已选ID数组”里，那么把“当前页全选按钮”和“所有页全选按钮”都置为false；如果当前页数据的id都在“已选ID数组”里，那么把“当前页全选按钮”置为true；进而如果“被选中项总数”等于“所有页总项数”，那么把“所有页全选按钮”置为true、把“所有页全选等级”置为1，否则把“所有页全选按钮”置为false。如果“单选按钮”点击后的状态是没选中，那么先把该项的id从“已选ID数组”中删除、把该项的id放到“没选ID数组”里、把“被选中项总数”减去1，然后把该“单选按钮”、“当前页全选按钮”和“所有页全选按钮”都置为false。

B、点击“当前页全选按钮”。如果“当前页全选按钮”点击后的状态是选中，那么先把当前页中没选中项的id放到“已选ID数组”里、把当前页中没选中项的id从“没选ID数组”里移除、把当前页中没选中的项的总数加到“被选中项总数”里、把“（当前页没选中的）单选按钮”置为true、把“当前页全选按钮”置为true；进而如果“被选中项总数”等于“所有页总项数”，那么把“所有页全选按钮”置为true、把“所有页全选等级”置为1，否则把“所有页全选按钮”置为false。如果“当前页全选按钮”点击后的状态是没选中，那么把当前页中选中项的id从“已选ID数组”中删出、把当前页中选中项的id放到“没选ID数组”、从“被选中项总数”里减去当前页选中项的总数、把“（当前页选中的）单选按钮”、“当前页全选按钮”、“所有页全选按钮”都置为false。

C、点击“所有页全选按钮”。如果“所有页全选按钮”点击后的状态是选中，那么把当前页中没选中项的id放到“已选ID数组”里、把“没选ID数组”置空、把“被选中项总数”赋值为“所有页总项数”、把当前页中没选中的项选中、把“所有页全选等级”置为1；进而把“当前页全选按钮”和“所有页全选按钮”都置为true。如果“所有页全选按钮”点击后的状态是没选中，那么所有数据都回到初始化状态。

（3）点击分页。在“首页”、“上一页”、“下一页”、“尾页”、“跳转”任何一个被点击后，记录所有被影响的数据。实现思路：

A、点击后，对当前页的页数进行重新赋值，向后台发送请求，返回数据，渲染到页面上。

B、当“所有页全选等级”为0时，如果当前页某项数据的id在“已选ID数组”里已经存在，则该项显示为选中，否则显示为不选中；如果当前页所有项数据的id在“已选ID数组”里都已经存在，则“当前页全选按钮”置为true；进而如果“被选中项总数”等于“所有页总项数”，那么把“所有页全选按钮”置为true，否则置为false。当“所有页全选等级”为1时，如果当前页某项数据的id在“没选ID数组”里不存在，则该项显示为选中，否则显示为不选中；如果当前页所有项数据的id在“没选ID数组”里都不存在，则“当前页全选按钮”置为true；进而如果“被选中项总数”等于“所有页总项数”，那么把“所有页全选按钮”置为true，否则置为false。

（4）点击操作。在“下载”、“删除”、“部署”任何一个被点击后，向后台传送数据。两种情形：

A、如果“所有页全选等级”为0。点击“下载”，向后台传值包含：a、“所有页全选等级”；b、“已选ID数组”；后台把“已选ID数组”的所有数据发给前端下载。

B、如果“所有页全选等级”为1。点击“下载”，向后台传值包含：a、“所有页全选等级”；b、“没选ID数组”；后台把“没选ID数组”里的数据排除，把剩下的所有数据发给前端下载。

注：刷新的两种情形（1）页面重新加载，本页HTML重新渲染，本页JS从头到尾执行一遍，本页所有变量都会初始化；（2）点击本页某个按钮，触发相关事件，执行相关JS，更新相关数据，不相关数据不变。