如何让这两个jQuery脚本一起工作？

Question

一个是用于Mp3s的音频播放器,另一个是Lightbox我试图在其中显示YouTube视频.

这是头部:

<script type="text/javascript" src="videobox/js/mootools.js"></script>
<script type="text/javascript" src="videobox/js/swfobject.js"></script>
<script type="text/javascript" src="videobox/js/videobox.js"></script>
<link rel="stylesheet" href="videobox/css/videobox.css" type="text/css" media="screen" />

<link rel="stylesheet" href="libs/css/styles.css" />
<script src="libs/jquery/jquery.js"></script>
<script src="src/jquery.ubaplayer.js"></script>
<script>
   $(function(){
            $("#ubaPlayer").ubaPlayer({
            codecs: [{name:"MP3", codec: 'audio/mpeg;'}]
            });
        });
</script>

我注意到当我删除"libs/jquery/jquery.js"时灯箱工作,但我的音频播放器停止工作.

在Javascript/JQuery方面我不是很熟练,所以答案可能很明显.

更新:

这解决了这个问题!

<script type="text/javascript" src="videobox/js/mootools.js"></script>
<script type="text/javascript" src="videobox/js/swfobject.js"></script>
<script type="text/javascript" src="videobox/js/videobox.js"></script>
<link rel="stylesheet" href="videobox/css/videobox.css" type="text/css" media="screen" />

<link rel="stylesheet" href="libs/css/styles.css" />
<script src="libs/jquery/jquery.js"></script>
<script src="src/jquery.ubaplayer.js"></script>
<script>
   jQuery.noConflict();
   jQuery(function(){
            jQuery("#ubaPlayer").ubaPlayer({
            codecs: [{name:"MP3", codec: 'audio/mpeg;'}]
            });
        });
</script>

Answer 1

MooTools和jQuery都使用$变量,这意味着你不能同时使用它们.2解决方案:

1. 搜索这两个功能的jQuery/MooTools实现,我相信你会找到它们.
2. 使用jQuery.noConflict让MooTools的使用$变量.

3. 在 jQuery 之后使用jQuery变量代替$并包含MooTools .如果要使用jQuery 的快捷方式,请使用回调的as参数将dQuery代码包装在domready事件中:$$

   jQuery(function($) {
       // ... jQuery code ($ has a copy of `jQuery` now)
   });
   // ... MooTools code ($ has a reference to the `MooTools.id` method now)