Rails 3 和 FancyBox

Question

我刚刚开始尝试学习 JS，如果这看起来是一个愚蠢的问题，我很抱歉，但我有点迷茫。我有一组从我的 Flickr 页面上刮下来的图像，我决定添加一个灯箱来尝试获得一些 JS 经验，所以我从the GitHub page 安装了它，并按照说明添加到应用程序。 js：

//= require jquery
//= require fancybox

并添加到我的 custom.css：

/*
 *= require_self
 *= require fancybox
 *= require_tree .
*/

然后我有：

<script type = "text/javascript">
$(document).ready(function() {

/* This is basic - uses default settings */

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

 });
</script>

在部分中，调用创建的一组图像：

<%= link_to(image_tag(p.url, :class => 'flickr_photo', :title => p.title, :border => 0), p.url_photopage) %>

现在我有点卡住了，它并没有真正做任何事情，但它也没有出错，所以任何帮助都会非常棒！

Answer 1

您可能在 Prototype 的 $ 标识符上遇到了冲突（我假设您没有摆脱标准的 RoR Prototype 代码）。 Prototype 是一个类似于 jQuery 的 Javascript 库，并与 RoR 捆绑在一起。问题是它也使用$，就像jQuery一样，所以最终发生的事情是每个$都被尝试作为原型函数或变量。这就是我在我的应用程序中修复它的方式，它对一些图像使用了 jQuery 滑块：

• 将jQuery.noConflict(); 添加到它将在其他jQuery 代码之前加载但在实际jquery.js 文件之后的位置。查看您的 jQuery .js 文件中的哪个首先加载，并将其放在文件的开头。
• 接下来，您必须将所有 jQuery 代码从使用 $ 更改为使用 jQuery。在您最喜欢的文本编辑器中对您的 jQuery .js 文件使用查找/替换来完成此操作。
• 确保所有未来的 jQuery 代码都使用 jQuery 而不是 $（即，jQuery("#id_of_element").show(); 而不是 $("#id_of_element").show();）

您可能会发现，这会将 jQuery 标识符从 $ 更改为 jQuery，从而消除了 Prototype 的冲突。如果我的诊断是正确的，那应该可以解决您的问题！