如何创建适用于无限滚动加载行为的方法查询

Question

我正在创建一个输出1000-3000条记录列表的页面。目前的流程是：

1. 用户加载页面
2. jQuery的命中服务器中的所有记录，并将其注入到该页面。

问题在于，对于某些用户来说，这些记录可能需要3秒以上才能返回，这是一种可怕的用户体验。

我想要做的是： 1.用户加载页面 2. jQuery命中服务器并获得至多100条记录。然后一直循环直到装载的记录等于最大记录为止。

这里的想法是用户快速查看记录，并不认为有什么破碎。

所以它不是一个真正的无限滚动，因为我不关心滚动位置，但它看起来像一个类似的流程。

如何在jQuery中我可以在循环中的服务器？以及如何在轨道上查询考虑到偏移和限制？

谢谢

Answer 1

您可以简单地向服务器反复查询一批数据。

有许多API可以实现。像：

client: GET request /url/ 
server: { 
    data: [ ... ] 
    rest: resturl 
} 
client GET request resturl 
repeat. 

或者你可以让客户端的参数传递说你想要的资源1-100，然后101-200和在循环中做到这一点。

在这期间，因为它涉及你将会呈现数据。

你的服务器或者需要让你在参数传递说你想记录我到I + N。

或者您的服务器需要获取所有数据。将它存储在某个地方，然后返回一大块数据以及某种唯一的id或url来请求另一块数据并重复此操作。

// pseudo jquery code 
function next(data) { 
    render(data.records); 
    $.when(getData(data.uniqueId)).then(next); 
} 

function getData(id) { 
    return $.ajax({ 
     type: "GET", 
     url: ... 
     data { 
      // when id is undefined get server to load all data 
      // when id is defined get server to send subset of data stored @ id. 
      id: id 
     }, 
     ... 
    }); 
} 

$.when(getData()).then(next);