如何避免jQuery库和其他库的冲突

时间:2021-02-01 21:54:19

默认情形:jQuery用$作为自身的快捷方式

1. jQuery库在其他库之后导入

(1)方法:使用jQuery.noConflict()函数将变量$的控制权转移给其他库

(2)操作:

(a)在js代码的开头加上jQuery.noConflict()函数

(b)jQuery的代码使用如下方式

 jQuery(function(){
jQuery("p").click(function(){
alert("aa");
})
})

此时的$权被移交给其他函数,如果想使用快解方式,可以如下定义:

var $j = jQuery.noConflict();

这样便可以利用$j替换上面的jQuery。

如果还想使用$而不管其他库的$()方法,可以使用下面两种方法解决:

方法一:

 jQuery(function($){                        //使用jQuery设定页面加载时执行的函数
$("p").click(function(){ //在函数内部继续使用$()方法
alert("aa");
})
})

方法二:

(function($){
$(function(){ //定义匿名函数并设置形参为$
$("p").click(function(){ //匿名函数内部的$均为jQuery
alert("aa"); //继续使用$()方法
})
})
})

2. jQuery库在其他库之前导入

无需使用 jQuery.noConflict()函数