超级简单实现ecshop系统点击购物弹出漂亮的提示

之前在本论坛中也看到过有朋友发帖。点击“购买之后”弹出一个提示框框。如图：
 

 

我看过了代码之后感觉有点复杂。而且弹出的层实际上是利用样式的“显示”和“隐藏”的属性来做的！而且弹出的位置死板！！
今天我研究了下之后发现了一个很简单的方法来实现这个功能！


一：把如下函数代码加入到common.js最末尾
 

/* *  
* 点击购物后弹出提示层   
* Chen 2010.7.28  
* 参数 cartinfo：购物车信息   
*/function openDiv_chen(cartinfo)   
{  
  var _id = "speDiv";  
  var m = "mask";  
  if (docEle(_id)) document.removeChild(docEle(_id));  
  if (docEle(m)) document.removeChild(docEle(m));  
  //计算上卷元素值  
  var scrollPos;   
  if (typeof window.pageYOffset != 'undefined')   
  {   
    scrollPos = window.pageYOffset;   
  }   
  else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat')   
  {   
    scrollPos = document.documentElement.scrollTop;   
  }   
  else if (typeof document.body != 'undefined')   
  {   
    scrollPos = document.body.scrollTop;   
  }  
 
  var i = 0;  
  var sel_obj = document.getElementsByTagName('select');  
  while (sel_obj[i])  
  {  
    sel_obj[i].style.visibility = "hidden";  
    i++;  
  }  
 
  // 新激活图层  
  var newDiv = document.createElement("div");  
  newDiv.id = _id;  
  newDiv.style.position = "absolute";  
  newDiv.style.zIndex = "10000";  
  newDiv.style.width = "350px";  
  newDiv.style.height = "100px";  
  newDiv.style.top = (parseInt(scrollPos + 400)) + "px";  
  newDiv.style.left = (parseInt(document.body.offsetWidth) - 200) / 2 + "px"; // 屏幕居中  
  newDiv.style.overflow = "auto";   
  newDiv.style.background = "#FFF";  
  newDiv.style.border = "3px solid #59B0FF";  
  newDiv.style.padding = "5px";  
 
  //生成层内内容  
        newDiv.innerHTML = '<h4 style="font-size:14; margin:15 0 0 15;">' + "商品成功放入购物车 
  [<a href='javascript:cancel_div()' class='f6' >" + '关闭' + "</a>]<br><br>"+ cartinfo + "</h4>";  
        newDiv.innerHTML += "<br /><center><a  href='flow.php'>进入购物车</a>  
<a  [<a href='javascript:cancel_div()'>继续购物</a></center>";  
  document.body.appendChild(newDiv);  
 
 
  // mask图层  
  var newMask = document.createElement("div");  
  newMask.id = m;  
  newMask.style.position = "absolute";  
  newMask.style.zIndex = "9999";  
  newMask.style.width = document.body.scrollWidth + "px";  
  newMask.style.height = document.body.scrollHeight + "px";  
  newMask.style.top = "0px";  
  newMask.style.left = "0px";  
  newMask.style.background = "#FFF";  
  newMask.style.filter = "alpha(opacity=30)";  
  newMask.style.opacity = "0.40";  
  document.body.appendChild(newMask);  
}   
/////////////////////////////////////// 

这个函数很简单！直接复制ecshop中common.js的openSpeDiv()函数做个小修改即可！
二、找到addToCartResponse（）函数，common.js大约64行左右。
把里面的switch循环改成如下：
 

switch(result.confirm_type)  
      {  
        case '1' :  
          //if (confirm(result.message)) location.href = cart_url;  
          openDiv_chen(result.content)//将购物车信息作为参数传入  
                  break;  
        case '2' :  
          //if (!confirm(result.message)) location.href = cart_url;  
          openDiv_chen(result.content)  
                  break;  
        case '3' :  
          //location.href = cart_url;  
          openDiv_chen(result.content)  
                  break;  
        default :  
          break;  
      }