您的位置:首页 > Web前端 > JQuery

JQuery版本冲突问题

2011-08-19 22:26 330 查看
从网络中学到的:

摘录自ITeye,学习一下,其中“解决jQuery1.3.2和1.4.2的冲突”方法对本人帮助较大!

我们公司用的是jQuery1.4.2,还有jQuery1.3.2,还有可能要用1.2或者1.1的。至于要用这么多版本完全是因为插件是基于某个版本开发的。如果统一用一个版本的框架,会导致插件运行不正确。此外还用了prototype1.6.2,用prototype是因为click框架自带的。这样冲突就十分严重了,首先$就有prototype和jQuery的冲突,而且还有高端冲突即jQuery各版本之间对于jQuery引用的冲突。

(1)首先解决$的冲突,由于项目的click框架是用了jQuery1.3.2和prototype,并且可能要随Apache更新(意味着改了也是白改),而且改动jQuery1.3.2量大,因为很多插件是基于jQuery1.3.2的,并且有可能基于jQuery1.3.2的插件代码是用Java生成的(这无法改,因为源代码是jar包的)。因此考虑去掉prototype的$引用,改动量少。(测试不通过)

第一步:找到prototype.js源代码,将function $(element) {。。。},修改成function
$p6(element) {。。。}这将废弃原来的$命名空间,将其换成$p6。同时在后面加上两句var _temp$ = window.$;window.$=$p6;。这两句是为了保证prototype.js的里面引用了$的源代码能够正常使用,同时将别的框架的$引用暂存到临时变量空间中去。把这一句window.$
= _temp$;(返还$的控制权限给jQuery)放在文件的末尾会报错,不知道为什么,估计是prototype.js程序运行到最后,这个程序并没有结束,还要回到前面的代码去执行,而前面的代码还要用$,如果返还给jQuery了,当然就报错了。本人没用过prototype,只能这样猜测。

第二步:在基于prototype.js框架的所有插件的

头部加上以下代码

var _temp$ = window.$;//将jQuery1.3.2的$放到临时的变量空间上

window.$=$p6;//将prototype新的命名空间$j6赋予给$,这样做的目的是保持中间的原始代码对于$的引用不用改动,也就是不用改动中间原始的插件代码,同时又不会引用到jQuery1.3.2的$。

【中间的原始代码不动】

尾部加以下代码

window.$ = _temp$;//将$的引用权限返还给jQuery1.3.

第三步:以后要用基于prototype的选取函数就只能用$p6(element)了。

但是按照以上这种方式将prototype放弃$的做法,不知道为什么不可以。网上百度的资料也全是jQuery放弃$的控制权,不知道为什么?期待牛人解答。但是以下的(2)是本人测试过行的通的。至于jQuery放弃$控制权网上文章一大堆。大概就是两种情况(一)jQuery.js放在prototype.js前面,这个时候jQuery只能用jQuery来进行引用,prototype写的代码无需任何改动。(二)jQuery.js放在prototype.js后面,由于jQuery在后,默认它的$命名会覆盖掉prototype定义的$,因此需要多这么一句jQuery.noConflict();。它的意思就是释放它定义的$命名,并还原以前的$定义即prototype定义的$。

(2)再来解决jQuery1.3.2和1.4.2的冲突。(测试通过)

第一步:在1.4.2的源代码的最后加上一句
var $j4 = jQuery.noConflict(true);//之所以在源码这里加,而不是像大多数文章提的在要用到的时候加,这是因为很多基于1.4.2的插件都要加,在这里加可以避免过多插件加这句代码导致重复。这一句是将1.4.2的jQuery和$的引用权限全部放弃。也就是基于1.4.2的插件不能再用jQuery和$了。同时给予$j4的新的命名空间,注意它是window的属性。看1.4.2的源代码会发现它其实也就执行了这两句:window.$=_$;window.jQuery=_jQuery,道理同window.$=_temp$(返还命名空间)只是命名不同而已。

第二步:在基于1.4.2的框架的所有插件的

头部加上以下代码

var _temp$ = window.$,_tempjQuery = window.jQuery;/将jQuery1.3.2的$和jQuery放到临时的变量空间上

window.$ = $j4;//这句和下面的那句都是为了给中间的代码能够正确使用jQuery和$用的。后面的$j4是赋予他们正确的引用。

window.jQuery = $j4;

之所以要先放临时变量存储,有三点必须这样做的理由:

a:我们不希望改动大量的jQuery插件源代码,最好是不动,即使改的话,尽量改的少。而在头部尾部加改动代码,中间的原始代码不动也是不错的一种方式。

b:因为1.4.2的已经放弃了jQuery和$的控制权,但是已有的插件代码又用了他们来做引用,因为插件不可能预知冲突,即使有冲突他人开发的插件也一定要用$或者jQuery引用,除非它不是jQuery下的插件。

c:为了防止插件里面直接用window.$和window.jQuery进行引用从而导致引用到1.3.2的jQuery和$,虽然这种情况比较少,但是以防万一。

【中间的原始代码不动】

尾部加以下代码

window.$ = _temp$;//将$的引用权限返还给jQuery1.3.

window.jQuery = _tempjQuery;//将jQuery的引用权限返还给jQuery1.3.

第三步:以后要用基于jQuery1.4.2的选取函数就只能用$j4(element)了。

总结:到目前为止可行方案:jQuery1.4.2完全放弃$和jQuery的控制权限。1.3.2放弃$的控制权限但不放弃j

Query的权限,其实jQuery也可放弃,只不过要给个别名$j3。prototype最好放在jQuery1.3.2后面,它获得$的控制权限。只是以后

要用jQuery1.4.2就必须用$j4来引用了。但这样即使有再多的jQuery框架版本冲突问题,也全部解决掉了。假如来了个1.2的jQuery怎么办,参照(2)的执行步骤,只不过第一步改为var $j2 = jQuery.noConflict(true);第三步用$j2(element)罢了。道理都是相同的。

没有解决的问题:如果prototype的版本之间有$冲突怎么办呢?本人没学过prototype,不清楚它的解决方案。本来我以为按照jQuery解决冲突的方案是完全可以的,但是测试结果发现不行。坐等高人降临。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: