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();