最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
jQuery中noConflict解决冲突问题
时间：2014-12-18 编辑：简简单单 来源：一聚教程网
noConflict方法可以处理一些标记占用的冲突问题（这是目前我觉得的实用的用途）
jQuery.noConflict()函数用于让出jQuery库对变量$(和变量jQuery)的控制权。
一般情况下，在jQuery库中，变量$是变量jQuery的别名，它们之间是等价的，例如jQuery("p")和$("p")是等价的。由于变量$只有一个字符，并且特点鲜明，因此我们更加习惯使用$来操作jQuery库。
不过，其他JS库也可能使用变量$来进行操作，例如Prototype库。这个时候两个库可能会由于变量$的控制权问题而发生冲突。
此时，你可以使用该函数让出jQuery库对变量$的控制权，将该变量交给上一个实现它的JS库，之后我们只能使用变量jQuery来操作jQuery库。
此外，使用该函数，还可以同时让出变量$和变量jQuery的控制权，从而实现多个不同版本的jQuery库共存(详情见下面的示例说明)。
该函数属于全局jQuery对象。
$.noConflict()可以移交$的控制权，而如果是$.noConflict(true)，那么jQuery和$都会消失，重新赋值如：
| 代码如下 | 复制代码 |
|
var $ = window.$.noConflict(true), jQuery = $ | |
这样就能避免冲突在局部使用需要使用的jQuery版本啦。
jQuery noConflict() 方法
noConflict() 方法会释放会 $ 标识符的控制，这样其他脚本就可以使用它了。
实例
当然，您仍然可以通过全名替代简写的方式来使用 jQuery：
| 代码如下 | 复制代码 |
| $.noConflict(); jQuery(document).ready(function(){ jQuery("button").click(function(){ jQuery("p").text("jQuery 仍在运行！"); }); }); | |
实例
您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用，您可以把它存入变量，以供稍后使用。请看这个例子：
| 代码如下 | 复制代码 |
| var jq = $.noConflict(); jq(document).ready(function(){ jq("button").click(function(){ jq("p").text("jQuery 仍在运行！"); }); }); | |
实例
如果你的 jQuery 代码块使用 $ 简写，并且您不愿意改变这个快捷方式，那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外，依旧不得不使用 "jQuery"：
| 代码如下 | 复制代码 |
| $.noConflict(); jQuery(document).ready(function($){ $("button").click(function(){ $("p").text("jQuery 仍在运行！"); }); }); | |
加载两个版本的jQuery（这是不推荐）， 第二个版本中调用$.noConflict(true) 将返回全局的jQuery变量给第一个版本。
| 代码如下 | 复制代码 |
|
| |
这里有个技巧对于解决冲突特别有效。.ready() 方法可以给 jQuery 对象取个别名，这样就能够在传给 .ready() 的回调函数的内部继续使用 $ 而不用担心冲突（愚人码头注：原因：.ready()是一个闭包）：
| 代码如下 | 复制代码 |
如果必要的话，我们可以释放jQuery名字，传递true作为一个参数给这个方法。 这不是必须的，如果我们必须这样做的话（举个例子，如果我们在同一个页面上使用多个版本的jQuery库）， 我们必须考虑到大多数插件依靠jQuery存在的变量,这种情况下，可能导致插件不能正常操作。
例子:
Example: 将$引用的对象映射回原始的对象。
| 代码如下 | 复制代码 |
| jQuery.noConflict(); // Do something with jQuery jQuery("div p").hide(); // Do something with another library's $() $("content").style.display = 'none'; | |
Example: 恢复使用别名$，然后创建并执行一个函数，在这个函数的作用域中仍然将$作为jQuery的别名来使用。在这个函数中，原来的$对象是无效的。这个函数对于大多数不依赖于其他库的插件都十分有效。
| 代码如下 | 复制代码 |
| jQuery.noConflict(); (function($) { $(function() { // more code using $ as alias to jQuery }); })(jQuery); // other code using $ as an alias to the other library | |
Example: 你可以通过jQuery.noConflict() ready约束为一小段代码
| 代码如下 | 复制代码 |
|
| |
Example: 创建一个新的别名用以在接下来的库中使用jQuery对象。
| 代码如下 | 复制代码 |
|
var dom = {};
Before $.noConflict(true) | |