Question

好的，这就是情况。把头发拉出来了。

我是个菜鸟。仅使用导轨约6周。我正在使用标准安装程序包，我的代码大量使用原型帮助程序。就像我说的那样，noob;）

所以我想尝试一些jQuery效果，比如PrettyPhoto。但是，当首次加载页面时，PrettyPhoto效果很好。但是，一旦有人使用Prototype助手，比如使用link_to_remote创建的链接，Prettyphoto就会停止工作。

我已经尝试过jRails，JQuery网站上提出的所有修复措施都可以阻止冲突......

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

...甚至做了一些疯狂的事情，比如将prototype.js中的所有$重命名为$$$无济于事。原型助手破坏，或jQuery破坏。

似乎我所做的一切都不能让它们一起工作。

有什么想法吗？

以下是我的application.html.erb

的一部分

<%= javascript_include_tag 'application' %>
<%= javascript_include_tag 'tooltip' %>
<%= javascript_include_tag 'jquery' %>
<%= javascript_include_tag 'jquery-ui' %>
<%= javascript_include_tag "jquery.prettyPhoto" %>
<%= javascript_include_tag 'prototype' %>
<%= javascript_include_tag 'scriptalicious' %>
</head>
<body>
<script type="text/javascript" charset="utf-8">
  jQuery(document).ready(
    function() {
      jQuery("a[rel^='prettyPhoto']").prettyPhoto();
    });
</script>

如果我在jquery之前放置原型，那么原型助手就不起作用了如果我把noconflict子句放入，那么它都不起作用。

提前致谢！

克里斯

BTW：当我尝试这个时，来自jQuery网站：

<script>
 jQuery.noConflict();

 // Use jQuery via jQuery(...)
 jQuery(document).ready(function(){
   jQuery("div").hide();
 });

 // Use Prototype with $(...), etc.
 $('someid').hide();
</script>

我的页面消失了！

Answer 1

你应该使用jQuery.noConflict();，之后所有对jquery的调用都应该只使用jQuery()代替of $()

Answer 2

你可以做很多事情。

其中一个是检查加载JavaScript标记的顺序。通常，申请应该在最后。

如果使用jrails，则根本不需要加载原型和scriptaculous库。

我谦卑地建议你尝试以下方法：

<%= javascript_include_tag 'jquery', 'jquery-ui', 'tooltip', 'jquery.prettyPhoto', 'application' %>

由于您处于开发周期的开始阶段，因此您只能使用jquery库并完全取消原型。在jQuery方面有更多的选择。

我不是说这是每个人都应该做的事情，但在你的具体情况下这似乎是合理的。

Answer 3

看起来你差不多了。我想你想要这样的东西：

<%= javascript_include_tag 'prototype' %>
<%= javascript_include_tag 'scriptalicious' %>
<%= javascript_include_tag 'jquery' %>
<%= javascript_include_tag 'jquery-ui' %>
<%= javascript_include_tag "jquery.prettyPhoto" %>
<%= javascript_include_tag 'application' %>
<%= javascript_include_tag 'tooltip' %>

<script type="text/javascript">
  jQuery.noConflict();

  // Use jQuery via jQuery(...)
  jQuery(document).ready(
    function() {
      jQuery("a[rel^='prettyPhoto']").prettyPhoto();
  });

  // Use Prototype with $(...), etc.
  $('someid').hide();
</script>

我不确定你在jQuery网站上找到了什么样的例子，但jQuery（“div”）。hide（）;看起来它隐藏了您网页上的所有div，这就是您的网页消失的原因。没有冲突是你需要的。

重新排序javascript包含上述意味着您可以在application.js中包含您的内联JS，而有些人会认为这更整洁。

Answer 4

在以下文件中将 $ 符号更改为jQuery

<%= javascript_include_tag 'jquery-ui' %>
<%= javascript_include_tag "jquery.prettyPhoto" %>

首先包含jquery文件，然后包含prototype。

希望它能解决问题

如何让jQuery与Prototype一起工作

4 个答案: