0

我有这段代码在网页中运行良好：

<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行，它就会给出一个错误：

未捕获的类型错误：无法调用 null 的方法“infiniteCarousel”。

该prototype.js文件来自 http://prototypejs.org/，我将它用于其他一些功能。我用谷歌搜索了很多，但无法提出解决方案 - 我该如何解决这个问题？

4

1 回答 1

0

您的 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.noConflict引入 jQuery，并使用该方法放弃 jQuery 对$. 然后，您可以使用 IIFE 包装器仅在必要的函数内部将 $ 函数分配回 jQuery：

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

在这种特殊情况下，您不需要这样做，因为该$(document).ready()方法已经为您完成了。但是你应该习惯那个工具。

你应该替换原型。:)

于 2012-11-06T12:45:30.847 回答