ecshop优化7-Ecshop与Jquery兼容

http://hi.baidu.com/zhiweiniduai/item/cc8ac800deffe772bee97ec2

http://www.ecmoban.com/article-1629.html

ecshop JQUERY的冲突

  ECSHOP与JQUERY冲突的问题由来已久，网上很多解决方法比较繁琐，而且在某些地方还会出错，如产品比较功能等，本文中的方法结合了网上最新公开文章与本人实际开发的经验，基本上可完美解决ECSHOP与JQUERY的冲突。经测试，兼容ECSHOP原有所有的功能，包括产品比较功能，而且修改步骤简单明了：

1、修改文件：/js/transport.js

在文件最底部增加代码：

if (Object.prototype.toJSONString){var oldToJSONString = Object.toJSONString;Object.prototype.toJSONString = function(){ if (arguments.length > 0){return false;} else {return oldToJSONString.apply(this, arguments); } } }

2、修改文件:/js/compare.js
查找代码：

this.timer = window.setInterval(this.relocation.bind(this), 50);

修改为：

this.timer = window.setInterval(this.bind(this.relocation,this), 50);

查找代码：

lastScrollY : 0

在代码上面一行增加代码：

bind : function(obj1,obj2) {return function() {obj1.apply(obj2, arguments);} },

3、在以下模板文件中，找到嵌入global.js文件的代码，删除嵌入global.js
brand.dwt
brand_list.dwt
category.dwt
exchange_list.dwt
search.dwt

4、下载最新版的jquery库文件到模板目录中，如：
/js/jquery.1.5.2.js
如果你的模板中没有对应目录，则新建目录拷入jquery文件即可
5、修改文件：/themes/temlatename/library/page_header.lbi
在顶部加入代码：

<script src="/js/jquery.1.5.2.min.js" type="text/javascript"></script>
<script type="text/javascript">jQuery.noConflict();</script>

注意，以后调用JQUERY对象用jQuery，不要用$，因为一个$与ECSHOP原有的函数同名有兼容问题。

6、修改完毕！放心使用你的JQUERY特效吧

Ecshop与Jquery冲突的完美解决方案

ECShop把AJAX事件和JSON解析的模块放在common/transport.js之中，可以说它也有自己封装的一套工具，这其实是很正常的。

 

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

 

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

 

解决思路大概就是屏蔽ECshop扩展的toJSONString方法，用别的函数代替。

 

为了照顾下小菜们，就写详细点吧。

 

 

一，修改默认js文件

 

 

1、首先复制一份 transport.js 改名为 transport.org.js 提供给后台使用

 

 

2、屏蔽掉transport.js里的toJSON功能 行数大概有497-737行之间

由if ( ! Object.prototype.toJSONString) { 开头的代码。

 

修改352行为:

 

 legalParams = “JSON=” + $.toJSON(params);

 

修改408行为:

 

result = $.evalJSON(result);

 

屏蔽掉global.js里的如下代码（第10-13行）:

 

Object.prototype.extend = function(object)

{

  return Object.extend.apply(this, [this, object]);

}

3、修改index.js文件44行改为:

 

var res = $.evalJSON(result);

 

 

4、修改common.js文件

第34行改为:

 

Ajax.call(‘flow.php?step=add_to_cart’, ‘goods=’ + $.toJSON(goods), addToCartResponse, ‘POST’, ‘JSON’);

 

第850行改为:

 

Ajax.call(‘flow.php?step=add_package_to_cart’, ‘package_info=’ + $.toJSON(package_info), addPackageToCartResponse, ‘POST’, ‘JSON’);

 

第1056行改为:

 

Ajax.call(‘flow.php?step=add_to_cart’, ‘goods=’ + $.toJSON(goods), addToCartResponse, ‘POST’, ‘JSON’);

 

5、修改compare.js文件

第49行改为:

 

 this.data = $.evalJSON(cookieValue);

 

第67行改为:

 

 var obj = $.evalJSON(cookieValue);

 

第133行改为:

 

 document.setCookie(“compareItems”, $.toJSON(this.data));

 

6、修改global.js文件

第16行改函数名 :function $e()

第114和126行都改为:    var element = $e(element);

 

 

二，修改后台调用部分

 

 

 

7、<!———–路径修改———–>

修改后台头部引入transport.js路径 admin/templates/pageheader.htm 第9行改为: {insert_scripts files=”../js/transport.org.js,common.js”}

 

admin/templates/menu.htm

151行改成 {insert_scripts files="../js/global.js,../js/utils.js,../js/transport.org.js"}

 

 

 

  三，修改前台模板部分

 

 

8、修改themes/default/library/page_header.lbi文件在{insert_scripts files=’transport.js,utils.js’}上面加上如下代码

{insert_scripts files=’jquery.js,jquery.json.js’}

 

 

9、<!—–修改文件—–>

library/comment_list.lbi

第188行 :

 

 Ajax.call(‘comment.php’, ‘cmt=’ + $.toJSON(cmt), commentResponse, ‘POST’, ‘JSON’);

 

 

10、compare.dwt

第20行 :

 

var obj = $.evalJSON(document.getCookie(“compareItems”));

 

第24行 :

 

document.setCookie(“compareItems”, $.toJSON(obj));

 

 

11、flow.dwt

第138行 :

 

Ajax.call(‘flow.php?step=add_to_cart’, ‘goods=’ + $.toJSON(goods), collect_to_flow_response, ‘POST’, ‘JSON’);

 

第199行 :

 

 Ajax.call(‘flow.php?step=add_to_cart’, ‘goods=’ + $.toJSON(goods), fittings_to_flow_response, ‘POST’, ‘JSON’);

 

 

12、<!—–jquery文件需置顶的dwt文件—-jquery.js文件需要在compare.js文件加载前加载,否则会报错—–>

 

brand.dwt

brand_list.dwt

category.dwt

exchange_list.dwt

search.dwt

 

如:

{* 包含脚本文件 *}

{insert_scripts files=’jquery.js,jquery.json.js’}

{insert_scripts files=’common.js,global.js,compare.js’}