您现在的位置是:首页 > cms教程 > Ecshop商城教程Ecshop商城教程
ecshop商品详情页实现商品属性选择弹出层效果
冰旋2024-01-16Ecshop商城教程已有人查阅
导读通过本教程可以实现ECSHOP购买商品选择属 时弹出层来选择:1.在commen.js中找到function addToCartRespons
通过本教程可以实现ECSHOP购买商品选择属 时弹出层来选择:
1.在commen.js中
找到
function openSpeDiv(message, goods_id, parent)
整个函数,替换为
function openSpeDiv(message, goods_id, parent,goods_title,goods_thumb,goods_name) { 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 = "500px"; newDiv.style.height = "380px"; newDiv.style.top = (parseInt(scrollPos + 200)) + "px"; newDiv.style.left = (parseInt(document.body.offsetWidth) - 400) / 2 + "px"; // 屏幕居中 newDiv.style.background = "#fff"; newDiv.style.border = "5px solid #ffcae3"; var html = ''; //生成层内内容 html = '<div style="font-size:14;background:#fae3e9;width:480px;height:40px;line-height:40px;padding:0 10px;font-size:14px; "><span style="float:left; font-weight:bold">产品购买</span><a href=\'javascript:cancel_div()\' style="float:right;padding:0 26px 0 0;background:url(themes/xaphp/images/ico_closebig.gif) right center no-repeat;cursor:pointer;" >关闭</a></div><div class="cartpopDiv"><div class="toptitle"><a href="goods.php?id='+goods_id+'" class="pic"><img src='+goods_thumb+' /></a><p>'+goods_title+'</p></div>'; html += '<div class="coninfo">'; html +='<table cellspacing="7" cellpadding="0"><tr><td class="left"><span>品名:</span></td><td>'+goods_name+'</td></tr>'; for (var spec = 0; spec < message.length; spec++) { html +='<tr>'; html +='<td class="left" valign="top">'+message[spec]['name']+':</td>'; html +='<td>'; html +='<ul class="choose">'; if (message[spec]['attr_type'] == 1) { for (var val_arr = 0; val_arr < message[spec]['values'].length; val_arr++) { if (val_arr == 0) { html += "<li id='aa_"+val_arr+"' ><a id="+val_arr+" class='selected' onclick='changeAtt(this,id,name)' name="+message[spec]['values'][val_arr]['id']+" href='javascript:;'><input style='display:none' type='radio' name='spec_" + message[spec]['attr_id'] + "' value='" + message[spec]['values'][val_arr]['id'] + "' id='spec_value_" + message[spec]['values'][val_arr]['id'] + "' /><span>" + message[spec]['values'][val_arr]['label'] +'</span><i></i></a></li>'; } else { html += "<li id='aa_"+val_arr+"' ><a onclick='changeAtt(this,id,name)' id="+val_arr+" name="+message[spec]['values'][val_arr]['id']+" href='javascript:;'><input style='display:none' type='radio' name='spec_" + message[spec]['attr_id'] + "' value='" + message[spec]['values'][val_arr]['id'] + "' id='spec_value_" + message[spec]['values'][val_arr]['id'] + "' /><span>" + message[spec]['values'][val_arr]['label'] + '</span><i></i></a></li>'; } } html += "<input type='hidden' name='spec_list1' id='spe_num' value='" + val_arr + "' />"; html += "<input type='hidden' name='spec_list' value='" + val_arr + "' />"; } else { for (var val_arr = 0; val_arr < message[spec]['values'].length; val_arr++) { html += "<li><input type='checkbox' name='spec_" + message[spec]['attr_id'] + "' value='" + message[spec]['values'][val_arr]['id'] + "' id='spec_value_" + message[spec]['values'][val_arr]['id'] + "' />" + message[spec]['values'][val_arr]['label'] + '</li>'; } html += "<input type='hidden' name='spec_list' value='" + val_arr + "' />"; } html +='</ul>'; html +='</td>' html +='</tr>'; } html += '</table>'; html +='</div>'; html +="<div class='botmbtn'><a href='javascript:submit_div(" + goods_id + "," + parent + ")'><img type='image' src='themes/xaphp/images/btn_addcart.png'></a> <a href='javascript:collect("+goods_id+")'><img type='image' src='themes/xaphp/images/btn_favorite.png'></a></div>"; html +='</div></div>'; newDiv.innerHTML = html; 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);}
2.在flow.php中的
1.在commen.js中
找到
function addToCartResponse(result)
中的
else if (result.error == 6)
{
<span style="color:#FF0000;"><span style="color:#FF0000;">openSpeDiv(result.message, result.goods_id, result.parent);</span></span>
}
将if中的内容换为
<span style="color:#FF0000;">openSpeDiv(result.message, result.goods_id, result.parent,result.goods_title,result.goods_thumb,result.goods_name);</span>
将function openSpeDiv(message, goods_id, parent)
整个函数,替换为
function openSpeDiv(message, goods_id, parent,goods_title,goods_thumb,goods_name) { 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 = "500px"; newDiv.style.height = "380px"; newDiv.style.top = (parseInt(scrollPos + 200)) + "px"; newDiv.style.left = (parseInt(document.body.offsetWidth) - 400) / 2 + "px"; // 屏幕居中 newDiv.style.background = "#fff"; newDiv.style.border = "5px solid #ffcae3"; var html = ''; //生成层内内容 html = '<div style="font-size:14;background:#fae3e9;width:480px;height:40px;line-height:40px;padding:0 10px;font-size:14px; "><span style="float:left; font-weight:bold">产品购买</span><a href=\'javascript:cancel_div()\' style="float:right;padding:0 26px 0 0;background:url(themes/xaphp/images/ico_closebig.gif) right center no-repeat;cursor:pointer;" >关闭</a></div><div class="cartpopDiv"><div class="toptitle"><a href="goods.php?id='+goods_id+'" class="pic"><img src='+goods_thumb+' /></a><p>'+goods_title+'</p></div>'; html += '<div class="coninfo">'; html +='<table cellspacing="7" cellpadding="0"><tr><td class="left"><span>品名:</span></td><td>'+goods_name+'</td></tr>'; for (var spec = 0; spec < message.length; spec++) { html +='<tr>'; html +='<td class="left" valign="top">'+message[spec]['name']+':</td>'; html +='<td>'; html +='<ul class="choose">'; if (message[spec]['attr_type'] == 1) { for (var val_arr = 0; val_arr < message[spec]['values'].length; val_arr++) { if (val_arr == 0) { html += "<li id='aa_"+val_arr+"' ><a id="+val_arr+" class='selected' onclick='changeAtt(this,id,name)' name="+message[spec]['values'][val_arr]['id']+" href='javascript:;'><input style='display:none' type='radio' name='spec_" + message[spec]['attr_id'] + "' value='" + message[spec]['values'][val_arr]['id'] + "' id='spec_value_" + message[spec]['values'][val_arr]['id'] + "' /><span>" + message[spec]['values'][val_arr]['label'] +'</span><i></i></a></li>'; } else { html += "<li id='aa_"+val_arr+"' ><a onclick='changeAtt(this,id,name)' id="+val_arr+" name="+message[spec]['values'][val_arr]['id']+" href='javascript:;'><input style='display:none' type='radio' name='spec_" + message[spec]['attr_id'] + "' value='" + message[spec]['values'][val_arr]['id'] + "' id='spec_value_" + message[spec]['values'][val_arr]['id'] + "' /><span>" + message[spec]['values'][val_arr]['label'] + '</span><i></i></a></li>'; } } html += "<input type='hidden' name='spec_list1' id='spe_num' value='" + val_arr + "' />"; html += "<input type='hidden' name='spec_list' value='" + val_arr + "' />"; } else { for (var val_arr = 0; val_arr < message[spec]['values'].length; val_arr++) { html += "<li><input type='checkbox' name='spec_" + message[spec]['attr_id'] + "' value='" + message[spec]['values'][val_arr]['id'] + "' id='spec_value_" + message[spec]['values'][val_arr]['id'] + "' />" + message[spec]['values'][val_arr]['label'] + '</li>'; } html += "<input type='hidden' name='spec_list' value='" + val_arr + "' />"; } html +='</ul>'; html +='</td>' html +='</tr>'; } html += '</table>'; html +='</div>'; html +="<div class='botmbtn'><a href='javascript:submit_div(" + goods_id + "," + parent + ")'><img type='image' src='themes/xaphp/images/btn_addcart.png'></a> <a href='javascript:collect("+goods_id+")'><img type='image' src='themes/xaphp/images/btn_favorite.png'></a></div>"; html +='</div></div>'; newDiv.innerHTML = html; 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);}
2.在flow.php中的
if ($_REQUEST['step'] == 'add_to_cart')
里
$result['error'] = ERR_NEED_SELECT_ATTR;
$result['goods_id'] = $goods->goods_id;
$result['parent'] = $goods->parent;
$result['message'] = $spe_array;
下面添加
$goods_row = $GLOBALS['db']->getRow("select goods_name,goods_title,goods_thumb from ".$GLOBALS['ecs']->table('goods')." where goods_id='".$goods->goods_id."'");$result['goods_title']= $goods_row['goods_title'];$result['goods_thumb']= $goods_row['goods_thumb'];$result['goods_name'] = $goods_row['goods_name'];
大功告成
本文标签:
很赞哦! ()
相关教程
图文教程
ecshop广告链接删除affiche.php的方法
相信很多用过ECSHOP的站长都知道,ECSHOP的广告链接地址形式为;它中间用 affiche.php 做了一个过渡,目的在于统计广告效果等。
ecshop后台api检查删除no_license点击查看的方法
管理员如果超过24小时进入ECShop管理中心会自动执行版本检测,但有时网络不良,连线速度异常时,容易拖慢网页速度,因此,去掉版本检查有其必要 。
ecshop中以B开头的ecshop函数
ECSHOP中以B开头的ECSHOP函数,其实很少的,只有几个,大家看下面教程:brand_related_cat($brand)功能:获得与指定品牌相关的分类参数:$brand品牌id,为int类型
修改ecshop隐藏帮助中心文章页的评论功能的方法
第一步:首先我们打开 /article.php 文件;第二步:然后我们来修改 /themes/default/library/comments.lbi;这样就可以了,去重新刷新一下帮助中心的文章页,看是不是没有评论框了
相关源码
-
(自适应)帝国CMS7.5模板淘宝客导购博客文章源码本模板基于帝国CMS7.5内核深度开发,为电商导购类网站设计。采用响应式布局技术,确保在手机、平板及电脑端均能获得优质浏览体验。模板内置商品推荐模块与优惠信息展示区,可快速搭建专业导购平台。查看源码 -
(自适应)橙色家政服务清洁保洁服务pbootcms网站模板源码下载模板核心价值:基于PbootCMS内核开发的家政服务类网站模板,通过模块化设计展现服务项目、团队风采、服务案例等核心板块,突出时效预约、服务标准化展示等家政行业特性。查看源码 -
(自适应)帝国cms7.5模板自媒体文章新闻博客为帝国CMS7.5设计的响应式模板,采用H5技术构建现代化内容展示框架。通过智能断点检测技术实现手机、平板、PC三端适配查看源码 -
(自适应响应式)装修装潢设计公司网站源码下载本模板为装修设计企业打造,采用PbootCMS内核开发,整体设计突出空间美学与功能性结合。首页采用大图轮播展示工程案例,服务项目模块支持三维效果展示,呈现装修设计企业的专业形象与技术实力。查看源码 -
自适应APP应用程序介绍推广落地页pbootcms网站源码下载移动应用开发商设计的营销型落地页模板,基于PbootCMS内核深度开发采用前沿响应式架构,无缝适配手机端操作习惯与PC端展示需求。查看源码 -
帝国cms7.5女性护肤搭配美妆潮流网站源码带数据4.5G本模板专为女性美容护肤行业设计,提供美容护肤、发型设计、女性健康、时尚化妆、娱乐新闻、服饰搭配等女性潮流资讯内容展示。采用帝国CMS7.5开发,同步生成电脑端和手机端,满足用户对美容时尚信息的获取需求。查看源码
| 分享笔记 (共有 篇笔记) |
