我正在开发一个简单的图片库，从Flickr API中提取信息。基本上画廊的前提是每个页面必须包含10个图像，并根据每个图库中有多少图片进行分页。当用户点击照片时，应在框架中弹出覆盖图片。
您可以在此处找到CodePen上的代码：http://codepen.io/anfperez/pen/QEZNEZ
除了一个例外，我已经能够让图库成功运作：在第一页上，只加载了9张图片。我的理论是因为我有一些jQuery命令分页10个<img>元素。在我的HTML中，我有一个隐藏在#frame div中的img标记，它隐藏到用户点击图片之前。所以我的jQuery将隐藏的img标记计为最大10个图像的一部分，并将其包含在分页系统中。如何排除第一个img标签？我一直在尝试使用
$('img:not(:first)')
作为我的选择器，但它不起作用。
第二个问题是，如果您单击一个不同的页面，然后返回第一页，您现在可以看到一个大的空白框架元素。但是，只要没有点击图片，就应隐藏该元素。有关如何使此代码更清洁的任何建议吗？
答案 0 :(得分：1)
问题在于，当您在第38行的成功循环中设置它们时，您正在为所有<img>标记添加分页类。
这：$('img').addClass("paginate")
应该是：$('#photo-list img').addClass("paginate")
这会将其限制为照片列表div中的所有图像，因此它不会捕捉到您不可见的帧图像。这解决了一个问题和显示不可见框架的分页问题。你也可以在循环之外移动它，因为没有理由在每次循环迭代时都应该在所有图像上调用它。
不相关，你还应该在第78行添加一个分号.Chrome抛出一个错误，认为第一个匿名方法的返回值是调用下一个方法。代码看起来不错。