jQuery多个版本和其他js库冲突的解决方法
jQuery多个版本或和其他js库冲突主要是常用的$符号的问题，这个问题 jquery早早就有给我们预留处理方法了，下面一起来看看解决办法。
1.同一页面jQuery多个版本或冲突解决方法。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery测试页</title>
</head>
<body>
<!-- 引入1.6.4版的jq -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>
<script> var jq164 = jQuery.noConflict(true); </script>
<!-- 引入1.4.2版的jq -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script> var jq142 = jQuery.noConflict(true); </script>
<script>
(function($){
//此时的$是jQuery-1.6.4
$('#');
})(jq164);
</script>
<script>
jq142(function($){
//此时的$是jQuery-1.4.2
$('#');
});
</script>
</body>
</html>
2.同一页面jQuery和其他js库冲突解决方法
jQuery noConflict() 方法
noConflict() 方法会释放会 $ 标识符的控制，这样其他脚本就可以使用它了。
jquery.js在prototype.js之前进行引入,如：
<script src="jquery.js" type="text/javascript"></script> <script src="prototype.js" type="text/javascript"></script> <p id="pp">test---prototype</p> <p>test---jQuery</p>
2.1 当然，您仍然可以通过全名替代简写的方式来使用 jQuery：
<script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js，全名可以不调用。
jQuery(function(){ //使用jQuery
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
//此处不可以再写成$,此时的$代表prototype.js中定义的$符号。
$("pp").style.display = 'none'; //使用prototype
</script>
2.2 您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用，您可以把它存入变量，以供稍后使用。请看这个例子：
<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>
2.3 如果你的 jQuery 代码块使用 $ 简写，并且您不愿意改变这个快捷方式，那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外，依旧不得不使用 "jQuery"：
<script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
jQuery(document).ready(function($){
$("p").click(function(){ //继续使用 $ 方法
alert( $(this).text() );
});
});
jQuery(function($){ //使用jQuery
$("p").click(function(){ //继续使用 $ 方法
alert( $(this).text() );
});
});
</script>
2.4 使用语句块：
<script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
(function($){ //定义匿名函数并设置形参为$
$(function(){ //匿名函数内部的$均为jQuery
$("p").click(function(){ //继续使用 $ 方法
alert($(this).text());
});
});
})(jQuery); //执行匿名函数且传递实参jQuery
$("pp").style.display = 'none'; //使用prototype
</script>
这种使用语句块的方法非常有用，在我们自己写jquery插件时,应该都使用这种写法，因为我们不知道具体工作过程中是如何顺序引入各种js库的,而这种语句块的写法却能屏蔽冲突。
注意:
1.引用javascript类库时，把jQuery引用放在最后面，可以避免冲突。
2.特别要注意jQuery()代替$()时，jQuery是区分大小写的，因为javascript本身就是区分大小写的。
以上所述是小编给大家介绍的jQuery多个版本和其他js库冲突的解决方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！
相关推荐
-
jquery1.9 下检测浏览器类型和版本的方法
Jquery1.9版本中$.browser已被剔除: 判断浏览器类型: 复制代码 代码如下: $.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase()); $.browser.webkit = /webkit/.test(navigator.userAgent.toLowerCase()); $.browser.opera = /opera/.test(navigator.userAgent.toLowerCase(
-
用jQuery实现检测浏览器及版本的脚本代码
如何用 Javascript 检测浏览器似乎是老生常谈的问题.根据本人的经验,使用 Javascript 检测浏览器无非使用两大类的方法. 其一,是使用使用浏览器的功能属性.比如检测浏览器是否支持 getElementById 方法就可以使用 if (document.getElementById) { // the method exists, so use it here } else { // do something else } 虽然这样的检测无法得知用户具体使用哪一种
-
jQuery版本升级踩坑大全
背景 -------------------------------------------------------------------------------- jQuery想必各个web工程师都再熟悉不过了,不过现如今很多网站还采用了很古老的jQuery版本.其实如果早期版本使用不当,可能会有DOMXSS漏洞,非常建议升级到jQuery 1.9.x或以上版本.前段时间我就主导了这件事情,把公司里我们组负责的项目jQuery版本从1.4.2升级到了jQuery 1.11.3.jQuery官
-
使用jQuery判断IE浏览器版本的代码
IE还真是让设计师恨的牙痒痒的东西,且现在已经有IE6.IE7.IE8.IE9.IE10这个五种不同版本的浏览器,且都有一点小差异.但是没办法,为了让网页在每个浏览器中显示都一样还必须迁就它. 不过现在我基本上都不太愿意对低版本的IE去做兼容了.比如IE6.IE7这些直接忽略!IE8的话还凑合一下.好在IE9和IE10对网络标准支持都比较了,等IE9版本以上的浏览器普及以后就好很好了. 但是不做兼容归不做兼容,还是要简单的处理一下的.幸运的是 jQuery 提供了 browser 标记来让我们能
-
如何选择jQuery版本 1.x? 2.x? 3.x?
前言 大家在选择版本的时候,一般原则是越新越好,但其实不然,jQuery版本是在不断进步和发展的,最新版是当时最高技术水平,也是最先进的技术理念.如何选择jQuery版本是个值得思考的问题,下面来看看详细的介绍吧. 目前jQuery有三个大版本: 1.x:兼容ie678,使用最为广泛的,官方只做BUG维护,功能不再新增.因此一般项目来说,使用1.x版本就可以了,最终版本:1.12.4 (2016年5月20日) 2.x:不兼容ie678,很少有人使用,官方只做BUG维护,功能不再新增.如果不考虑兼
-
多个jQuery版本共存的处理方案
如何在一个页面上让多个jQuery共存呢?比如jquery-1.5和jquery-1.11. 你可能会问,为什么需要在一个页面上让多个jQuery共存?直接引用最新版本的jQuery不行吗? 答案是,不行.因为现实生活是非常残酷的.举个栗子: 现有网站已经引用了jQuery 1.5以及相关插件.如果直接将jQuery升级到最新版,这些插件就不工作了,除非你能把这些插件全部升级,或者等各个插件的作者发布支持最新版jQuery的版本. 现在,如果我们要基于jQuery开发新的插件或者写JavaScr
-
解决jquery版本冲突的有效方法
用过jQuery的朋友都知道jQuery不同版本会引发冲突,本文就此问题提出有效的解决方案如下: 案例:解决jQuery1.3.2和1.4.2的冲突.(本例已测试通过!) 第一步:在1.4.2的源代码的最后加上一句 : var $j4 = jQuery.noConflict(true); 之所以在源码这里加,而不是像大多数文章提的在要用到的时候加,这是因为很多基于1.4.2的插件都要加,在这里加可以避免过多插件加这句代码导致重复.这一句是将1.4.2的jQuery和$的引用权限全部放弃.也就是基
-
不同Jquery版本引发的问题解决
这是最近三个月写得最完美的作品了,用JS实现了一个拖拽排序,效果图如下:一开始进入项目有了这样的拖拽实现想法,一点头绪没有,请教师兄说这样实现不可能.当时觉得很遗憾,打算用传统的方式去实现.正构思传统的方式,感觉时间充裕,就回到了拖拽的想法上来.终于实现了.其实我不是炫耀这个(当然,感兴趣的话,可以QQ907087894联系我,我会整理Demo上传到资源中心),我想说的是下文.就在我实现的同时,师姐帮另一个伙伴写了一个传统方案的Demo,他进行的是修改的排序.在她机器上演示的时候,当时就觉得很震
-
jQuery1.4.2与老版本json格式兼容的解决方法
原json文件内容为: { label: 'Europe (EU27)', data: [[1999, 3.0], [2000, 3.9], [2001, 2.0], [2002, 1.2], [2003, 1.3], [2004, 2.5], [2005, 2.0], [2006, 3.1], [2007, 2.9], [2008, 0.9]] } 解决方法一: 改成标准的json格式,要求对字符串都使用""限定,修改后的内容为: { "label": "
-
基于jQuery1.9版本如何判断浏览器版本类型
在jquery.1.9以前的版本,可以使用$.browser很轻松的判断浏览器的类型和版本,但是在1.9中和以后的版本中,$.browser已经被删除,下面就介绍一下如何实现此功能,希望能够给需要的朋友带来帮助. 一.自定义代码: $.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase()); $.browser.webkit = /webkit/.test(navigator.userAgent.toLowerCas