的Prototype.js jQuery中

Question

創建與InfiniteCarousel問題，我有這樣的一段代碼在網頁中正常工作：

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<script src="jquery.infinitecarousel3.min.js"></script> 
<script type="text/javascript" src="easing.js"></script> 
<script> 
    $(function(){ 
     $('#carousel').infiniteCarousel({ 
      imagePath: 'images/' 
     }); 
    }); 
</script> 
<!--<script src="prototype.js"></script>--> 

然而，當我取消對prototype.js線它給出了一個錯誤：

Uncaught TypeError: Cannot call method 'infiniteCarousel' of null.

prototype.js文件是從http://prototypejs.org/，我正在使用它的一些其他功能。我已經Google了很多，但無法提出解決方案 - 我該如何解決？

Answer 1

您的Prototype.js庫正在接管$全局變量。你可以用這種方式您的document.ready快捷的範圍內分配變量$ jQuery的：

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<script src="jquery.infinitecarousel3.min.js"></script> 
<script type="text/javascript" src="easing.js"></script> 
<script> 
    $(function($){ 
     $('#carousel').infiniteCarousel({ 
      imagePath: 'images/' 
     }); 
    }); 
</script> 
<!--<script src="prototype.js"></script>--> 

的$(document).ready()功能，其快捷$(function(){})，發送jQuery的工廠函數作爲第一個參數的回調。命名參數$將在該函數中將本地$變量作爲jQuery範圍。

在未來，我建議把jQuery的在後原型，並使用jQuery.noConflict方法放棄的$ jQuery的控制。然後，您可以分配$函數返回的jQuery只在函數內部它是有必要，使用IIFE包裝：

// prototype code using prototype's $ out here 
(function($){ 
    // jQuery code using jQuery's $ goes here 
}(jQuery)); 

在這種特殊情況下，你不需要這麼做，因爲該$(document).ready()方法已經這樣做它您。但是你應該習慣這種工具。

而你應該替換原型。 :)