如何讓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一起工作

回答

相關問題