关于prototype和使用多个JQuery插件的冲突问题

解决Prototype与jQuery冲突

最新推荐文章于 2024-01-05 19:47:22 发布

原创最新推荐文章于 2024-01-05 19:47:22 发布 · 2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery插件 #prototype #magento #jquery #脚本

magento Designers 专栏收录该内容

38 篇文章

订阅专栏

本文介绍了一种有效解决Prototype和jQuery共存时产生的冲突的方法。通过重命名jQuery的$符号，确保所有jQuery代码都在ready函数内执行，从而避免了脚本间的冲突。

之前转载过一篇文章 http://blog.youkuaiyun.com/ddjohn/article/details/5767232 讲述关于prototype和jquery冲突的解决办法最近在制作前端js特效的时候发现还是不太完美实用。如果使用多个jquery插件的话比如lofJSidernews和jcarousel 不仅各个版本的IE提示脚本错误无法运行就连ff和chrome都接受不了。经过多番调试，总结magento内加入多个jquery兼容并用的方法，针对先加载prototype后jq 示例脚本如下:

var $jQ = jQuery.noConflict();

$jQ(document).ready(function() {
	$jQ('#jslidernews2').lofJSidernews( { interval:5000,
											easing:'easeInOutExpo',
											duration:1200,
											auto:true,
											mainWidth:750,
											mainHeight:327,
											navigatorHeight		: 109,
											navigatorWidth		: 223,
											maxItemDisplay:3 } );
	$jQ('#mycarousel').jcarousel({
        auto: 2,
        wrap: 'last',
        initCallback: mycarousel_initCallback
    });											
});

示例代码可以看出将$符号的使用全完全交给prototype并且重新命名JQ的$，所有JQ代码都藏在ready之内，这样就可以有效地避免脚本之间的冲突。That's it~Happy coding...