jQuery冲突

Question

我的页面上有一个wordpress插件lightbox2和一个新闻滚动器。

我的头部部分看起来像这样

<script type="text/javascript" src="wp-content/themes/soundsright/menu.js"></script>
<script type='text/javascript' src='wp-includes/js/prototype.js?ver=1.6'></script>
<script type='text/javascript' src='wp-includes/js/scriptaculous/wp-scriptaculous.js?ver=1.8.0'></script>
<script type='text/javascript' src='wp-includes/js/scriptaculous/effects.js?ver=1.8.0'></script>
<script type='text/javascript' src='wp-content/plugins/lightbox-2/lightbox.js?ver=1.8'></script>
<script type='text/javascript' src='wp-includes/js/jquery/jquery.js?ver=1.3.2'></script>

    <!-- begin lightbox scripts -->
    <script type="text/javascript">
    //<![CDATA[
    document.write('<link rel="stylesheet" href="wp-content/plugins/lightbox-2/Themes/Grey/lightbox.css" type="text/css" media="screen" />');
    //]]>
    </script>
    <!-- end lightbox scripts -->


        <!-- SwfObj Plugin version SWFOBJ_VERSION -->
        <script type="text/javascript" src="wp-content/plugins/swfobj/swfobject.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="wp-content/themes/soundsright/liscroll.js"></script>

<script type="text/javascript">
$(function(){
   $("ul#ticker01").liScroll({travelocity: 0.03});  

});

</script>

就像现在一样，新闻滚动器可以工作，但不能用灯箱插件。当我移除

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

然后，灯箱工作，但不是新闻滚动体。

我认为删除这个jQuery参考可以解决这个问题，因为wordpress已经在这行中加载了相同版本的jQuery

<script type='text/javascript' src='wp-includes/js/jquery/jquery.js?ver=1.3.2'></script>

，我在这里做错什么了吗？

Answer 1

我认为这将是因为function()冲突，我们最近也有类似的东西；您需要更精确地将它与jQuery匹配(基本上$引用将由prototype或其他javascripts之一拥有，因此您可以用jQuery替换它)。

jQuery(function(){

   jQuery("ul#ticker01").liScroll({travelocity: 0.03});  

});

Answer 2

$被Prototype和jQuery使用：

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Answer 3

由于JQuery和Prototype都使用$符号，所以在非冲突模式下使用Jquery

   jQuery.noConflict();

   JQuery(function(){
       JQuery("ul#ticker01").liScroll({travelocity: 0.03});      
   });

并使用$作为原型