的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()方法已经这样做它您。但是你应该习惯这种工具。

而你应该替换原型。 :)