重構ECShop中的Javascript（一）

ECShop一直有一個很大的問題，就是其自帶的JS腳本和jQuery爲主的很多使用很是多的JS框架衝突，這個衝突致使了咱們在製做ECShop模板的時候，不少優秀的界面效果沒法實現。能夠說是ECShop最讓人詬病的地方。


在網上搜索了幾天後，嘗試了網上各類不一樣的解決方案後，發現部分解決方案只是針對某一部分ECShop的版本有效，而在新版中本來有效的解決方案再次失效，或者是隻能解決部分jQuery使用的問題，但比較複雜的功能仍是會衝突。最後一怒之下，決定一勞永逸地解決這個該死的衝突問題。


個人主要思路是，其實ECShop這些JS的主要功能中，基本上均可以被jQuery的功能替代，或者重寫，也正是由於相同功能的不一樣實如今兩部分中同時存在，才引起了這麼多衝突。因此，只要把我須要的JS功能用jQuery重寫，這個問題也就不存在了。


首先，咱們須要先肯定究竟是哪些功能引發了衝突，這裏我不能，也沒有時間解決所有問題，所以，提出的僅僅是一個思路，和解決我所遇到的那一部分問題。若是在其餘地方衝突，你們能夠根據狀況自行修改。


在製做模板的時候，我遇到的最大的問題就是在商品列表頁和商品顯示兩個頁面的模板中的添加購物車功能的Javascript與jQuery衝突。因此，咱們先看看這個添加購物車的功能，究竟幹了什麼。在firebug中追蹤添加購物車後的通信，結果以下：

服務器端的回覆以下：

隨後，頁面便被跳轉到了購物車界面(http://www.ecshop.cn/flow.php?step=cart)。

接下來，看看addToCart這個函數究竟幹了什麼。

從這裏咱們能夠看到，它檢查過了商品規格後，向服務器端經過Ajax發送了一組數據，並採用addToCartResponse函數接收。和jQuery衝突的，正是這兩個函數，因而，咱們在新的函數中，改掉這一段便可。