时间戳

首页 > 解决方案 > 如何使用ajax打开精美的盒子图像拇指？

jquery - 如何使用ajax打开精美的盒子图像拇指？

问题描述

当我使用 AJAX 加载图像时，我单击图像，但第一次没有显示图像缩略图。我该如何处理？

$(document).on("click", ".fancybox", function() {
  $('[data-fancybox]').fancybox({
    toolbar: false, // disable toolbar
    thumbs: {
      autoStart: true,
      hideOnClose: true
    },
  });

标签： jqueryfancyboxfancybox-3

解决方案

首先，为什么要使用这样的代码，它来自哪里？我已经多次看到这种模式，这是完全错误的。

所以，让我们分解你的代码，看看你在这里做什么 -

$(document).on("click", ".fancybox", function() {- 您将点击事件分配给每个具有类名的元素.fancybox。该点击事件将执行以下操作：

$('[data-fancybox]').fancybox({- 在这里您将点击事件分配给每个具有 data-attribute 的元素data-fancybox；并且该点击事件将使用自定义选项启动fancybox。

你看到问题了吗？删除$(document).on("click", ".fancybox", function() {部分，它应该可以正常工作。或者，您可以使用$.fancybox.open()立即启动 fancybox 的方法（而不是使用分配点击事件$(selector).fancybox()）

推荐阅读