(五)解决jQuery和其它库的冲突
在jQuery库中,几乎所有的插件都被限制在它的命名空间里。全局的对象都很好地存储在jQuery命名空间里,因此当把jQuery和其它javascript类库一起使用时,不会引起冲突.(注意:默认情况下,jQuery用$作为自身的缩写而已)
如果jQuery类库和别的类库冲突的话,可以使用jQuerynoConflict()函数来将变量$的控制权移交出给其它的javaScipt库。看下面小片断代码
<script type="text/javascript" src="../JS/JsCOM.js"></script>
<script type="text/javascript" src="../jQuery/jquery-1.3.2-vsdoc2.js"></script>
假设JsCOM.js库中,有这样一个函数
function $(objName) {
if (document.getElementById) {
return eval('document.getElementById("' + objName + '")')
}
else {
return eval("document.all." + objName)
}
大家都知道jQuery里面也一个这样的函数,为了不引起冲突,我们将jQuery的变量$的控制权移交出给别的javascript库
jQuery.noConflict(); //将变量$的控制权移交给JsCOM.js
var $cr = jQuery("#cr"); //照样使用jQuery类库,只是用jQuery代替了原来的$而以。
var JsCOM_cr = $("cr"); //使用JsCOM.js类库
在这里可以把jQuery()函数作为jQuery对象的制造工厂.
在这里要注意几点
1.引用javascript类库时,一定要把jQuery引用放在最后面,就像上面一样,JsCOM.js的引用在jQuery引用的前面(具体原因我也不知,不过确实需要这样)
2.特别要注意jQuery()代替$()时,jQuery是区分大小写的,因为javascript本身就是区分大小写的(好像说这个有点多余,不过还是希望大家不要犯这种错误)
基本上根据上面的方法就可以解决jQuery和其它库的冲突问题了!
如果你觉得上面的方式不爽,每次都要打jQuery来代替$增加了您敲键盘的工作量,那请接着看。。
除上面之外,还有另一种选择。如果想确保jQuery不会与其它库冲突,但又想自定义一个快捷方式,可以进行如下操作;
var $j = jQuery.noConflict(); //自定一个快捷方式
var $cr = $j("#cr"); //使用jQuery类库,得用自定义快捷方式----$j;
var JsCOM_cr = $("cr"); //和上一段代码一样,使用的是JsCOM.js类库
如果您还有别的要求,想继续使用原先的$(),同时还需要与别的类库不冲突的话,还有两种解决方法
其一:
jQuery.noConflict(); //将变量$的控制权让给JsCOM.js
jQuery(function($)
{
$("p").click(function() //在函数内继续可以使用jquery类库的$()方法
{
alert($(this).text());
})
})
var JsCOM_cr = $("cr"); // 在函数外面,照样可以使用JsCOM.js的$()方法
其二:
jQuery.noConflict(); //将变量$的控件权移交给别的类库,使用jquery类库的$符号时,请使用jQuery("#id");
(function($) { //定义匿名函数并设置形参为$
$(function() { //匿名函数内部的$均为jQuery
$("div").click(function() {//继续使用$()方法
alert($(this).text());
})
})
})
(jQuery); //使用匿名函数且传递实参jQUery
alert($("cr")); //使用的是jsCOM.js类库中的$()函数
第二种方法应该是兼容旧的代码最好的方式,修改的代码是最少的!
不过如果是新写的jQuery代码,我还是比较喜欢使用刚开始讲的那种(jQuery.noConflict(),然后就使用jQuery("#id"),这种方式)
如果您的页面是先引用jQuery类库再引入别的类库的话,那么我们可以直接使用jQuery来做一些工作,同时,可以使用$()方法作为其它库的快捷方式。这里无需调用jQuery.noConflict()函数,请看下面代码
<script type="text/javascript" src="../jQuery/jquery-1.3.2-vsdoc2.js"></script>
<script type="text/javascript" src="../JS/JsCOM.js"></script>
jQuery().ready(function() { //无需调用jQuery.noConflict()函数
var $cr = jQuery("#cr");
$cr.click(function() {
if ($cr.is(":checked")) {
alert("感谢你的支持!你可以继续操作了..");
}
})
})
alert($("cr")); //使用的是jsCOM.js类库中的$()函数
好了,看了上面这么多种方法来解决冲突,这下你可以放心的在您的项目中引用jQuery了吧
来自:http://www.cnblogs.com/Ss_Andy/archive/2010/06/24/1764471.html
更多资源:http://www.cnblogs.com/piuba/archive/2013/07/26/3217256.html
(五)解决jQuery和其它库的冲突的更多相关文章
- 解决jquery与其他库的冲突
1.jquery在其他库之后导入 第一种: jQuery.noConflict();//将变量$的控制权限交给其他类库,即将$的控制权让渡给其他类库 jQuery(function(){ jQuery ...
- 解决jquery和其他库的冲突
一.jquery在其他库之后导入 (1)jQuery.noConflict(); //将变量的$控制权转交给其他库. jQuery(function(){ ...
- 解决jQuery和其他库冲突
<script> console.log($); // //jquery在其他库之前导入,直接使用jQuery()或 // var $replace = jQuery.noConflict ...
- iOS解决两个静态库的冲突 duplicate symbol
http://blog.163.com/023_dns/blog/static/118727366201391544630380/ 场景: 解决TencentOpenAPI.framework与Zba ...
- 解决jquery和prototype库冲突问题
在项目中同时引入了jquery.js和prototype.js两个文件,在方法调用时启了冲突. 我们在使用 jQuery 的过程中我们会频繁使用 $ 符号,$是JQuery的别名,所有使用$的地方也都 ...
- 解决jQuery多个版本,与其他js库冲突方法
jQuery多个版本或和其他js库冲突主要是常用的$符号的问题,这个问题 jquery早早就有给我们预留处理方法了,下面一起来看看解决办法. 1.同一页面jQuery多个版本或冲突解决方法. < ...
- jQuery库(noConflict)冲突解决机制
很多JSFramework库选择使用$符号作为一个函数或变量名,而在实际的项目开发,模板语言,则有可能"$"符号是模板语言keyword.例如Veclocity模板语言,$它是ke ...
- 解决jquery与zepto等其它库冲突兼容的问题
解决jquery与zepto等其它库冲突兼容的问题;(function ($) { }) (jQuery); ;(function ($) { }) (Zepto); 在Bootstrap ...
- (function($, window, document) {}) jQuery 调用解决与其他javascript库冲突的写法
将函数包在红色字体内部,可以解决$符号与其他插件的冲突. <script type="text/javascript"> (function($, window, do ...
随机推荐
- BZOJ3561 DZY Loves Math VI 【莫比乌斯反演】
题目 给定正整数n,m.求 输入格式 一行两个整数n,m. 输出格式 一个整数,为答案模1000000007后的值. 输入样例 5 4 输出样例 424 提示 数据规模: 1<=n,m<= ...
- inux监控平台搭建-监控项
linux监控平台搭建-监控项 本人运维某生态互联网监控平台服务.过程中遇见了很多问题.目前互联网有很多的开源监控工具:nagios.zabbix.falcon.cacti...各有优点.这里不讲解监 ...
- [AGC008F] Black Radius(树形dp)
神题啊!! Description 给你一棵有N个节点的树,节点编号为1到N,所有边的长度都为1 "全"对某些节点情有独钟,这些他喜欢的节点的信息会以一个长度为N的字符串s的形式给 ...
- 判断是手机端还是pc端
<script type="text/javascript"> if (window.location.toString().indexOf('pref=padinde ...
- 自动合并多个文件如js css等 可以增加效率
原文发布时间为:2011-01-13 -- 来源于本人的百度文章 [由搬家工具导入] 原文地址:http://www.codeproject.com/KB/aspnet/HttpCombine.asp ...
- ASP.NET MVC 1.0 哈哈。。转过来,还没学。。
原文发布时间为:2009-06-13 -- 来源于本人的百度文章 [由搬家工具导入] ASP.NET MVC 1.0 发布了投递人 itnews 发布于 2009-03-19 00:46 评论(8) ...
- flash编程实例源代码下载
原文发布时间为:2008-08-20 -- 来源于本人的百度文章 [由搬家工具导入] http://library.sx.zj.cn/shgp/ActionScript编程实例详解.rar
- [LeetCode] Jump Game II 贪心
Given an array of non-negative integers, you are initially positioned at the first index of the arra ...
- [LeetCode] Longest Substring Without Repeating Characters最长无重复子串
Given a string, find the length of the longest substring without repeating characters. For example, ...
- 线程之间通信 等待(wait)和通知(notify)
线程通信概念: 线程是操作系统中独立的个体,但这些个体如果不经过特殊的处理就不能成为一个整体,线程之间的通信就成为整体的必用方式之一.当线程存在通信指挥,系统间的交互性会更强大,在提高CPU利用率的同 ...