在容器

Question

我想请求帮助，为我的问题提供一些更有效和通用的解决方案

我有类似画廊的东西，它不断加载“页面”

结构如下：

<div class="pageseparator"></div>

<div id="searchpage0">
   <figure id="0-1" class="imgrid"></figure>
   <figure id="1-1" class="imgrid"></figure>
   <figure id="2-1" class="imgrid"></figure>
   <figure id="3-1" class="imgrid"></figure>
</div>

<div class="pageseparator"></div>

<div id="searchpage1">
   <figure id="0-2" class="imgrid"></figure>
   <figure id="1-2" class="imgrid"></figure>
   <figure id="2-2" class="imgrid"></figure>
   <figure id="3-2" class="imgrid"></figure>
</div>

<div class="pageseparator"></div>

<div id="searchpage2">
   <figure id="0-7" class="imgrid"></figure>
   <figure id="1-7" class="imgrid"></figure>
   <figure id="2-7" class="imgrid"></figure>
   <figure id="3-7" class="imgrid"></figure>
</div>

我真正想要的是： 我点击了一些数字。我打开一个记录，由图形表示（所有在一个页面上，所有内容都使用jquery和服务器的异步加载处理）。

然后，我需要实现箭头（按钮），这将显示NEXT或PREVIOUS记录

所以我需要保存当前点击的数字的ID。在NEXT / PREV按钮上，我需要遍历所有结构并找到NEXT或PREV图，获取其ID并执行.trigger（“click”）; （数据已将其记录加载到页面的另一部分）

但所有数字都是动态创建的，甚至有一个已知的生成ID的逻辑（我不知道，如果在第二个搜索页面上将是0-2,1-2 ......或0-7,1-7。 ..或其他任何东西），实施起来很难，比如：

I am at 1-1. Does 2-1 exists?
Yes - save current ID, trigger click
No - Does Next Page exists?
    YES - find first figure, save ID, trigger
    NO - Find the very first figure in the very first searchpage, save ID, trigger

所以请。这里是否有任何解决方案，更少的处理时间，更少的代码延长，通常更像亲？

提前致谢

Answer 1

取而代之的是，您可以制作Carousel。之后，您可以生成每个轮播项目的单击以弹出一个框，您可以使用AJAX获取数据。

因此，您不必拥有多个具有多个数字的div，而是将一个div包含在一次显示4个所有数字或任意数量的数字中。