Fancybox 打开新窗口 [重复]答案

【问题标题】：Fancybox opens new window [duplicate]Fancybox 打开新窗口 [重复]
【发布时间】：2014-10-28 18:35:00
【问题描述】：

所以我正在使用这个 rails gem：https://github.com/kyparn/fancybox2-rails

在前端使用 BackboneJS 并在视图中实例化 fancybox

Fancybox 在本地完美运行，但在登台和制作时，图像会在新窗口中打开。我检查了 chrome 控制台，并确保 fancybox 存在，确实存在。

不完全确定如何解决此问题/继续调试此问题。

这就是我设置图像的方式：

   <a class="fancybox-image" data-fancybox="image" href="image_url">
   <img src="image_url" data-js="activate-img-modal">
   </a>

我在每个图像所在的 Backbone 视图中实例化 fancybox 设置。

  setupFancyBox: function() {
     var options = {
       helpers: {
         overlay: {
           locked: false
         }
        }
      };
      this.$("[data-fancybox='image']").fancybox(options);
  }

该函数在 View 的渲染方法中调用。

【问题讨论】：

很可能是另一个 js 错误（提升、jQuery 版本冲突等）正在阻止 fancybox 工作......但没有任何代码或 jsfiddle 只是一个猜测
控制台没有出现 JS 错误。
我对BackboneJS不是很熟悉，但最后一行的“this”是什么意思？也许它应该没有这个关键字，只需 $("[data-fancybox='image']").fancybox(options);

标签： jquery ruby-on-rails backbone.js fancybox

【解决方案1】：

所以在本地我的图片 (.jpg/.png) 上有扩展名，如下所示：

 <a class="fancybox-image" data-fancybox="image" href="path/to/image1.png">
   <img src="path/to/image1.png" data-js="activate-img-modal">
 </a>

但在生产/现场没有图像扩展：

 <a class="fancybox-image" data-fancybox="image" href="path/to/image1.">
   <img src="path/to/image1." data-js="activate-img-modal">
 </a>

缺少扩展，导致 fancybox 无法为我激活。

将从此处进行修复 (Fancybox urls without .jpg opens not in box)：

  $(".fancybox").fancybox({
    type: 'image'
  });

【讨论】：

【解决方案2】：

检查javascript控制台，如果出现一些javascript错误，它可以阻止进一步的javascript代码执行。下一步尝试在控制台初始化fancybox，只需运行这段代码（当然使用你自己的选择器）

$("a.fancybox").fancybox();

【讨论】：

我试过这个，它能够选择包装图片的“a”标签。还有fancybox。
您如何以及在何处放置您的fancybox 初始化代码？你应该把它放在文档就绪事件中。
我刚刚更新了问题