Chinaunix首页 | 论坛 | 博客
  • 博客访问: 79343
  • 博文数量: 22
  • 博客积分: 486
  • 博客等级: 下士
  • 技术积分: 225
  • 用 户 组: 普通用户
  • 注册时间: 2011-07-15 21:30
文章分类

全部博文(22)

文章存档

2013年(2)

2012年(4)

2011年(16)

分类: 系统运维

2011-09-28 10:30:30

ecshop首页js轮播代码失效问题及transport.js和Jquery的冲突问题
前几天在首页加入了一个广告轮播代码,js调用ecshop后台广告位的。今天发现突然失效了。下面着手解决这个问题,看了下网上的很多方法,下面是我用的方法。
ECShop把AJAX事件和JSON解析的模块放在common/transport.js之中,可以说它也有自己封装的一套工具,这其实是很正常的。

但恰恰的,在封装JSON各种方法的同时对object的模型进行了重写,这个就跟jQuery冲突了。因为众所周知的,jQuery对各种 JavaScript对象进行了扩展。

这一切其实都很容易理解,各有各的理由十分自然,但头痛和无奈的就变得在我们这些使用者身上了。在ECShop论坛上原来也有很多朋友提出了这个问题,也提出了各种各样的方法,我尝试了一些,不好或者甚至无用,所以只好自己动手了。

解决思路:

一切起因就是在于两者都重写了Object,所以当然任意一方让步就可以了。在这里我选择了修改代码量比较少的transport.js,除了简单,更重要的是去修改jQuery的话框架提供的强大特效和各种敏捷方法就失效了,还不是得不偿失。

1、加入JSON2.js文件
原因很简单,transport修改Object是为了加入支持JSON的方法。所以我这里用JSON官网在javascript语言上提供的 json2.js支持
2、修改transport.js


2.1 注释掉重写object的方法,具体搜索
  1. if ( ! Object.prototype.toJSONString) {
这一段代码,然后把里面的内容全部注释掉。(参考:注释掉496-737行)

2.2 加入新的JSON支持方法
  1. Js代码
  2. function objToJSONString(obj, filter){
  3.     return JSON.stringify(obj, filter);
  4. }
  5.    
  6. function parseObjectToJSON(object, filter){
  7.     return JSON.parse(object, filter);
  8. }

也可以看到其实都很简单,都是调用json2.js里面提供的方法,有人觉得不必在这里添加直接调用也可以,但我还是建议做这样的一个适配器在这,因为容易容易表明用意。

2.3 修正AJAX方法

2.3.1 在transport.js搜索params.toJSONString() 改为 objToJSONString(params)

2.3.2 继续在transport.js搜索result.parseJSON() 改为 parseObjectToJSON(result)(具体在408行左右)

3、修复旧JSON调用地方

简单来说就是把所有*.toJSONString() 的调用改为用objToJSONString(*),而*.parseJSON()改为parseObjectToJSON(*)。

例如: comm.js里面第一个函数里面的

Ajax.call('flow.php?step=add_to_cart', 'goods=' + goods.toJSONString(), addToCartResponse, 'POST', 'JSON');

要改为Ajax.call('flow.php?step=add_to_cart', 'goods=' + objToJSONString(goods), addToCartResponse, 'POST', 'JSON');

comm.js里面还有一些Ajax.call调用tojsonstring的,都需要按照本例替换。


但非不得已不建议把一切旧的调用都修复,应该选择性的修复,应当出现冲突的地方我们才必须去修复。

就是说哪里调用了jQuery,就把修正后的transport.js及json2.js导入,并且修复toJSONString和 parseJSON方法,其他页面几不必了。


所以说,也不建议在header里面就加入了jQuery,因为这样每个页面都会出现冲突了,修复工资也比较麻烦了,能避免尽量避免了。

最好的解决方案就坐等ECShop来搞定了。

同样的,这次的冲突不具备特殊性,也是一次很好的经验,因为以后遇到修改object等对象的场合并不会少,有这次的经验就知道如何应对了。


PS:附件为修复后的transport.js及common.js文件,注意调用之前必须加入json2.js文件。


 js.zip  
阅读(2473) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~