jquery库与其他库冲突的问题解决

来源：互联网发布：看星空的软件编辑：程序博客网时间：2024/05/29 08:10

jQuery.noConflict() 方法

在使用jQuery开发的时候，可能还会使用到其他的JS库，比如Prototype，但多库共存时可能会发生冲突；若是发生冲突后，可以通过jQuery.noConflict() 方法进行解决

定义和用法

noConflict() 方法让渡变量 $ 的 jQuery 控制权。

该方法释放 jQuery 对 $ 变量的控制。

该方法也可用于为 jQuery 变量规定新的自定义名称。

提示：在其他 JavaScript 库为其函数使用 $ 时，该方法很有用。

语法

jQuery.noConflict(removeAll)

参数描述removeAll布尔值。指示是否允许彻底将 jQuery 变量还原。

说明

许多 JavaScript 库使用 $ 作为函数或变量名，jQuery 也一样。在 jQuery 中，$ 仅仅是 jQuery 的别名，因此即使不使用 $ 也能保证所有功能性。假如我们需要使用 jQuery 之外的另一 JavaScript 库，我们可以通过调用 $.noConflict() 向该库返回控制权：

一、 jQuery库在其他库之前导入，直接使用jQuery(callback)方法：

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><!--先导入jQuery --><script src="http://www.cnblogs.com/scripts/jquery-1.3.1.js" type="text/javascript"></script><!--后导入其他库 --><script src="prototype-1.6.0.3.js" type="text/javascript"></script></head><body><p id="pp">test---prototype</p><p >test---jQuery</p><script type="text/javascript">jQuery(function(){        //直接使用 jQuery ,没有必要调用"jQuery.noConflict()"函数。　　jQuery("p").click(function(){        alert( jQuery(this).text() ); 　});});$("pp").style.display = 'none'; //使用prototype</script></body></html>

二、jQuery库在其他库之后导入，使用jQuery.noConflict()方法将变量$的控制权让渡给其他库，有以下几种方式:

<script type="text/javascript">jQuery.noConflict(); //将变量$的控制权让渡给prototype.jsjQuery(function(){ //使用jQuery       jQuery("p").click(function(){              alert( jQuery(this).text() );       });});$("pp").style.display = 'none'; //使用prototype</script>//代码二<script type="text/javascript">var $j = jQuery.noConflict(); //自定义一个比较短快捷方式$j(function(){ //使用jQuery       $j("p").click(function(){       alert( $j(this).text() );       });});$("pp").style.display = 'none'; //使用prototype</script>//代码三<script type="text/javascript">jQuery.noConflict();     //将变量$的控制权让渡给prototype.jsjQuery(function($){      //使用jQuery       $("p").click(function(){ //继续使用 $ 方法       alert( $(this).text() );       });});$("pp").style.display = 'none'; //使用prototype</script>//代码四<script type="text/javascript">jQuery.noConflict();               //将变量$的控制权让渡给prototype.js(function($){  //定义匿名函数并设置形参为$       $(function(){ //匿名函数内部的$均为jQuery              $("p").click(function(){ //继续使用 $ 方法                     alert($(this).text());              });       });})(jQuery); //执行匿名函数且传递实参jQuery$("pp").style.display = 'none'; //使用prototype/*********************************************************************/jQuery(document).ready(function(){ //   一加载页面的时候就将权利让出去        jQuery.noConflict(); });</script>

转自：http://www.cnblogs.com/JoannaQ/archive/2013/04/06/3001858.html

参考http://www.w3school.com.cn/jquery/jquery_noconflict.asp