为什么prototype.js会干扰不相关的javascript操作？

Question

建立一个网站。当我这样订购标签时，LightCycle 可以工作，但 Lightbox 不能：

Lightcycle 可以工作，Lightbox 不能：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>    
<script type="text/javascript" src="./js/prototype.js"></script>

当我这样订购时，Lightbox 可以工作，但 LightCycle 不能：

Lightbox有效，LightCycle 无效：

<script type="text/javascript" src="./js/prototype.js"></script>    
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

令人沮丧。

Answer 1

您遇到了冲突，因为两个库都使用 $ 快捷方式。查看 jQuery 的无冲突功能或原型的等效功能。

您可以在此处阅读更多信息：http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Answer 2

因为它们使用相同的 $ 简写。

请尝试以下操作：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script type="text/javascript" src="./js/prototype.js"></script>

Answer 3

调用 jQuery.noConflict() 可以修复它吗？如果您错过了 $ 快捷方式，您还可以在 on 函数中为 jQuery 指定一个别名：

 var $j = jQuery.noConflict();

参考资料：

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

http://samsami2u.wordpress.com/2009/03/14/prototypejs-jqueryjs-conflict-and-resolution/

Answer 4

因此，使用超现实梦境再污染，我实现了这一点：

<script src="./prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

   <script>
     var $j = jQuery.noConflict();

     // Use jQuery via $j(...)
     $j(document).ready(function(){
       $j("div").hide();
     });

     // Use Prototype with $(...), etc.
     $('someid').hide();
   </script>


<script type="text/javascript" src="./js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="./js/lightbox.js"></script> 

<script type="text/javascript" src="http://malsup.github.com/chili-1.7.pack.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.lite.1.0.min.js"></script>

<script type="text/javascript">

$(function() {
    $('#slideshow1').cycle({
        delay: 2000,
        speed: 1000,
    });


});

</script>

下一个浮现在脑海中的问题是用什么来替换“someid”。我假设“#slideshow1”。但当我这样做时，显示的只是一个纯黑色的页面。恼人的。