jquery-plugins - 在 noConflict() 模式下使用 jQuery 插件 ColorBox

Question

我在 Joomla! 中使用 jQuery 插件 ColorBox!主题，并且很难让它在 noConflict() 模式下工作。我有以下代码调用我的 jQuery 和 noConflict();调用，然后是我实际的 jQuery 标记:

<script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" language="javascript">jQuery.noConflict();</script>
<script type="text/javascript" language="javascript" src="PATH TO COLORBOX"></script>
<script type="text/javascript" language="javascript">
    jQuery(document).ready(function(){
        jQuery('a.colorbox').colorbox();
    })
</script>

但是，我根本无法让它在 noConflict() 模式下工作。当禁用无冲突模式时，它可以正常工作，但 Joomla 中关联的 Mootools 脚本将无法工作。

有人能给我指出正确的方向吗？非常感激，西蒙

Answer 1

原来这一切，都和Joomla!的顺序有关。正在调用脚本。因此，对于所有遇到相同问题的人来说，您的脚本调用都必须在 Joomla! 之后调用!包含 head 标签，如下所示:

<jdoc:include type="head" />
<script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" language="javascript">jQuery.noConflict();</script>
<script type="text/javascript" language="javascript" src="<?php echo JURI::base(); ?>templates/helen-o-grady/js/jquery.colorbox-min.js"></script>
<script type="text/javascript" language="javascript">
        jQuery(document).ready(function(){         
        jQuery('a.colorbox').colorbox({iframe:true, width:900, height:650});
        })(jQuery)
</script>