首先我们应该知道,在jquery中,$(美元符号)就是jquery的别名,也就是说使用$和使用jquery是一样的,在很多时候我们命名空间时,正是因为这个$而产生的冲突的发生。比如说:$('#xmlas')和JQuery('#xmlas') 虽然在写法上不同,但在实际上却是完全等同的。
要想解决这个冲突,其实最简单的方法就是使用不同的名称来命名,或者让执行代码认为是不同的命名空间即可。

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

 代码如下 复制代码

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--先导入jQuery -->
<script src="../../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.js
jQuery(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.js
jQuery(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>

除了上面的方法之外,我们还可以采用第二种方法来解决冲突的问题,那就是最笨但最有效的解决方法:用自定义的命名空间来避免冲突。
比如说需要的项目名称为xmlas,那么我们原来的代码:

 代码如下 复制代码

$('contentArea').show()

就可以写成以下这种形式:

 代码如下 复制代码

XMLAS('contentArea').show()

3.在jquery代码中,当遇到冲突的时候我们可以使用$符号,这需要我们在ready事件中添上以下代码:

 代码如下 复制代码

jQuery(document).ready(function($) {   
    //你在这里可以放心的使用$了  
    });

当然,您也可以简写成下面的形式:

 代码如下 复制代码
    jQuery(function($){   
    //这里为使用$的代码  
    });  

由此,根据第一个方法来实现的完整代码如下:

 代码如下 复制代码
    //jquery库与其他库冲突的完整解决办法  
    <script type="text/javascript" src="photolist.js"></script>   
    <script type="text/javascript" src="jquery.js"></script>   
    <script type="text/javascript">   
    $.noConflict();   
    jQuery(function($) {   
    //使用了$的jquery代码  
    });   
    //这里是你的其他js库代码   
    </script>

当然,你也可以对上面的完整代码进行一步的简化,简化代码如下:

 代码如下 复制代码

//简化后的代码  
    $.noConflict()(function(){   
    //这里是你的带$的jquery代码  
    });   
    //这里是其他库的代码

 

Jquery库及其他库之间的$命名冲突解决办法的更多相关文章

  1. jquery获取不到append出来的新元素的解决办法

    jquery获取不到append出来的新元素的解决办法 $('body').on("click","property",function(){}) jq1.7+ ...

  2. jQuery库冲突解决办法

    一次面试中面试官问到jQuery解决怎么冲突?虽然以前看过,但是我已经不记得了. 我的思路就是如果让我来设计,那我就用一个默认值$,不传参数,那就用$,最后就挂载在window.$上,传参数就用传入名 ...

  3. macOS下加载动态库dylib报"code signature invalid"错误的解决办法

    一.现象描述 在macOS上搞开发也有一段时间了,也积攒了一定的经验.然而,今天在替换工程中的一个动态库时还是碰到了一个问题.原来工程中用的是一个静态库,调试时发现有问题就把它替换成了动态库.这本来没 ...

  4. .Net Framework项目引用.NetStandard标准库出现版本冲突解决办法

    今天在工作中出现一个引用问题,害我找问题找了很久.起因是在一个Winform项目下需要引用一个.NetStandard标准库,标准库引用了System.ComponentModel.Annotatio ...

  5. pycharm不能安装第三方库,错误代码Non-zero exit code (1) 的解决办法

    pycharm版本 2019.3 大致意思是安装失败,建议的解决方案:尝试从系统终端运行此命令.确保使用正确的'pip'版本,该版本已为位于'C:\ Users \ G \ Desktoplgianf ...

  6. jquery的$post方法不发送空数组的解决办法

    问题:jquery里的ajax在提交post请求时,如果数据里有一个空数组,则这个空数组不会提交上去 技术上的解决办法如下: 源代码: var params = { type : , ids:[] } ...

  7. css命名冲突解决方法

    css的命名冲突目前有几种解决方法: 1.命名约定 人为的制定一下命名规则以避免冲突,例如前缀,嵌套等 2.CSS in JS 在JavaScript中写CSS,使用工具编译为css,最常见的是sty ...

  8. IOS lib(.a)库冲突解决办法

    在引入第三方lib(.a)库时,经常会由于第三方lib库中又引入同你现有工程相同的开源代码而造成.o冲突,最近在集成汉王名片识别时发生ASIHttp的.o冲突.我想说的是像这种开源的使用率很高的源代码 ...

  9. Android 第三方库导致jar包冲突解决办法

    这几天的任务是将mapbox的工程合到程序中去,但是合并过程却出现了问题 合并方法: 在app的build.gradle中添加 dependencies { compile ('com.mapbox. ...

随机推荐

  1. Fibonacci数列

    问题描述 Fibonacci数列的递推公式为:Fn=Fn-1+Fn-2,其中F1=F2=1. 当n比较大时,Fn也非常大,现在我们想知道,Fn除以10007的余数是多少. 输入格式 输入包含一个整数n ...

  2. velocity 快速入门

    基本语法      1.变量定义 : $name 注意 : a.名字和$配合一起用  b.更规范的写法是 ${name} 2.赋值 : #set($name = "威少") 3.条 ...

  3. MEF 编程指南(二):定义可组合部件和契约

    可组合部件(Composable Parts)   在 MEF 内部可组合部件是一个可组合单元.可组合部件导出其他可组合部件需要的服务,并且从其他可组合部件导入服务.在 MEF 编程模型中,可组合部件 ...

  4. poj2105 IP Address(简单题)

    题目链接:id=2105">http://poj.org/problem?id=2105 ----------------------------------------------- ...

  5. 445port入侵具体解释

    445port入侵具体解释   关于"445port入侵"的内容445port入侵具体解释本站搜索很多其它关于"445port入侵"的内容 445port入侵, ...

  6. 怎么去掉li标签前面的点??

    <ul class="list"> <li> </li> <li> </li> </ul> .list li ...

  7. [MODX] 3. Placeholder +

    A chunk may be used in many pages, different page may require different style. We can use Placeholde ...

  8. LINUX 内核导论

    http://blog.csdn.net/ljy1988123/article/category/1490573/2

  9. Haproxy+MYSQL 负载均衡 原创

    [root@monitor app1]# yum install haproxy Loaded plugins: security : epel | : epel/primary_db | : ext ...

  10. requestFileSystem is undefined

    使用phonegap 3时,用File API,不应该用cordova plugin add org.apache.cordova.file等添加File API Plugin. 要用: phoneg ...