javascript - fotorama 如何使用 ajax

Question

我在 fotorama 中使用 ajax 遇到了两个问题

i）在ajax之前，我的代码是：

<div id="AjaxPhoto" class="fotorama" data-nav="thumbs" data-ratio="4/3"></div>

在ajax之后，我的代码是：

<div id="AjaxPhoto" class="fotorama" data-nav="thumbs" data-ratio="4/3">
  <img src="1.jpg" />
  <img src="2.jpg" />
</div>

在这种情况下，fotorama 可能有效或无效

ii) 当我通过以下方式清除数据时，假设 fotorama 工作“成功”

$("#AjaxPhoto").empty();
$(".fotorama--hidden").remove();

然后添加其他图像，fotorama 完全不能再工作了。fotorama 支持 ajax 吗？

Answer 1

当您清除照片并重新添加照片时，您需要再次重新初始化插件以使其正常工作。

$("#AjaxPhoto").empty();
$(".fotorama--hidden").remove();
// Load the new set of Photos here
// after that the below statement will re-initialize the fotorama gallery plugin
$('.fotorama').fotorama();