如何让jQuery与Prototype一起工作

好的，就是这样的情况。一直把我的头发拉出来。如何让jQuery与Prototype一起工作

我是这个的noob。只使用轨道约6周。我正在使用标准安装包，而且我的代码大量使用了原型助手。就像我说的，noob;）

所以我试图把一些jQuery的效果，像PrettyPhoto。但是会发生什么，当页面首次加载时，PrettyPhoto效果很好。但是，一旦有人使用Prototype帮助程序（如link_to_remote创建的链接），Prettyphoto将停止工作。

我试过jRails，都提出了jQuery网站停止冲突的修复...

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

...甚至做了一些疯狂的事情，喜欢重命名所有原型的$ .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>

我的网页上消失！

来源

2010-03-27 thinkfuture

你应该使用jQuery.noConflict();并在此之后将jQuery所有呼叫只能用做的，而不是jQuery()of $()

来源

2010-03-27 09:55:18 Omu

我也试过，但也没有效果。 – thinkfuture 2010-03-27 20:21:37

有很多的事情可以做。

其中之一是检查您加载您的JavaScript标签的顺序。通常应用程序应该结束。

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

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

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

既然你是在开发周期的开始，你可以只使用jQuery库，并完全消除原型。 jQuery方面有更多的选择。

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

来源

2010-03-27 12:20:13 allesklar

谢谢！我打算在某个时候完全转向jQuery，但目前我的应用需要工作。 Allesklar，我编辑了我的包含标签，因为你注意到但我的原型链接停止工作。 – thinkfuture 2010-03-27 20:21:19

尝试在'tooltip'之前添加原型和scriptaculous。 – allesklar 2010-03-28 16:11:39

我做到了，没有区别。 – thinkfuture 2010-03-29 05:36:44

看起来你几乎就在那里。我想你想是这样的：

<%= 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，这就是页面消失的原因。不冲突就是你需要的。

对javascript的重新排序包含如上所述意味着您可以将您的内联JS包含在application.js中，而不是某些人认为整洁的。

来源

2010-03-29 18:27:53

Thanks Tim！我试过这个，但后来我的原型链接被冲洗掉了。 :( – thinkfuture 2010-03-30 16:49:20

您是否正在使用application/tooltip.js中的$ function？如果您将application/tooltip.js移动到noConflict块中的之后，这是否有所帮助？ – 2010-03-30 20:00:37

变化$符号的jQuery在这些下列文件

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

首先包括jQuery的文件，然后包括原型。

希望它能解决问题

来源

2010-04-25 07:09:31 Fero

如何让jQuery与Prototype一起工作

回答

相关问题