所以,我想问如何为我遇到的问题创建适当的概念/解决方案。我很确定我会掩盖它,但在与这里的一些人交谈后,我发现剥猫皮的方法不止一种,而且更多时候更好。哈哈。
所以,我有一些数据通过 ajax 调用传入。太好了。所有这些都被捆绑在一个篮子里,我认为它可以创建页面分页。
例如,我得到一桶 4 个项目,我的分页是每页 2.. 等于 2 页。我只构建单击一个分页的页面。我有数据,但然后我将其构建出来。 (为了下面的例子)。
这是我的问题。我必须检索第二组数据(它是单独的 ajax 调用),并且第二组数据可能将附加数据附加到第一组项目。
如何最好地将第二组映射到第一组,即使它们的显示尚未构建。
所以,为了便于讨论,我有我刚刚收到的第一组数据。假设每页只有 2 个项目。
总的来说,我的第一个存储桶包含以下数据:
data = [
{name:ITEM1, desc: Greatest Book in History, id: 98987 },
{name:ITEM2, desc: Second Greatest Book in History, id: 76557 },
{name:ITEM3, desc: Third Greatest Book in History, id: 121212 },
{name:ITEM4, desc: Fourth Greatest Book in History, id: 09546 }
]
第一页。
<小时/>ITEM 1 - Greatest Book in history
ITEM 2 - Second Greatest Book in history
<小时/>
点击第2页分页
<小时/>ITEM 3 - Third Book in history (**special sale: Special Edition**)
ITEM 4 - Fourth Greatest Book in history
现在,我的第二个数据如下
特殊数据 = [ {121212:特价销售:特别版} ]
因此,第二个 ajax 调用将发送我所有的第一个存储桶 IDS 并返回任何可用的"new"信息。如果有,我将在显示中附加新数据。
现在,我的猜测是:
1).等待第二个请求完成,然后将第一个存储桶数据附加到第二组信息,因此当我构建分页时,数据会在请求分页时构建。
或
2).正常构建第一个数据桶,然后应用与项目 id 号相同的 * 元素 id * .... 当获取第二个数据桶时,我将新信息附加到 html 元素 id 中。 .这就是我找到合适匹配的方法。唯一的事情是,我必须知道该特定元素 ID dom 项是否存在(对当前分页页面可见/构建),然后才能附加该新信息。
<div>ITEM 3 - Third Book in history<span id="121212"></span></div>
我在这里缺少什么?这比我做的简单吗?
最佳答案
为了简洁性和 JavaScript 提供的数据结构的性质,我可能会选择第二种方法。鉴于您已使用 jQuery 标记了问题,这里是一个实现。
var dataBucket = {};
function enrichBucket(incomingData) {
for(var i = 0, len = incomingData.length; i < len; i++) {
var dataEntry = incomingData[i];
dataBucket[dataEntry.id] = $.extend( dataBucket[dataEntry.id]||{}, dataEntry);
}
}
http://api.jquery.com/jQuery.extend/如果你想进行深度合并,请查看 [deep] 标志。
关于javascript - 将ajax数据分配到分页数据中,最好的方法是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12983897/