jquery 和 mootools 冲突 - 一个脚本有效，另一个不

Question

好的，我使用mootools通过google maps显示flash内容，我努力让它正常工作，所以几乎没有机会切换到jQuery。另一方面，我认为 jQuery 对其他所有事情都更有用，所以我试图让它一起工作。那是为了解释。现在是代码。

我用来显示/隐藏动画的这个 jQuery 脚本，它与 mootools 完美配合

<script type="text/javascript">
jQuery(document).ready(function() {
 // hides the slickbox as soon as the DOM is ready
 jQuery('#slickbox').hide();
 // toggles the slickbox on clicking the noted link  
  jQuery('#slick-toggle').click(function() {
    jQuery('#slickbox').toggle(400);
    return false;
  });
});

最近，我在动画流动菜单中添加了脚本，但无法正常工作。我试图应用 noConflict，但它没有用。代码如下：

<script language="text/javascript">
var $j = jQuery.noConflict();
var name = "#floatMenu";
var menuYloc = null;
    $j(document).ready(function(){
        menuYloc = parseInt($j(name).css("top").substring(0,$j(name).css("top").indexOf("px")))
        $j(window).scroll(function () { 
            offset = menuYloc+$(document).scrollTop()+"px";
            $j(name).animate({top:offset},{duration:500,queue:false});
        });
    }); 
 </script>

错误消息是 Uncaught TypeError: Object # has no method 'dispose' 非常感谢。

Answer 1

以这种方式格式化您的代码，并且 无需使用 noConflict()。 在 jQuery 和 MooTools 库加载后立即调用 jQuery.noConflict();。

<script type="text/javascript">
(function($){
    var name = "#floatMenu",
        menuYloc = null;
    $(document).ready(function(){
        menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px")))
        $(window).scroll(function () { 
            var offset = menuYloc+$(document).scrollTop()+"px";
            $(name).animate({top:offset},{duration:500,queue:false});
        });
    });
})(jQuery);
</script>

这会将您的代码封装到一个函数中，该函数将传递jQuery 对象。在该函数中使用$ 的任何地方都会引用jQuery。

此外，没有属性language 具有值"text/javascript"，它是type 属性，它应该具有该值。不要再使用language 属性了。