您现在的位置是:首页 > cms教程 > DedeCMS教程DedeCMS教程
dedecms购物车优化商品全选及数量增加减按钮的方法
尤介辉2023-09-17DedeCMS教程已有人查阅
导读dedecms商城功能,有很多用户体验并完善,需要进一步开发,增加了下图的几个功能:增加商品js全选功能;js自动增加减数量功能(也可手动输入数量)
dedecms商城功能,有很多用户体验并完善,需要进一步开发,增加了下图的几个功能:增加商品js全选功能;js自动增加减数量功能(也可手动输入数量);对应的自定义字段(如服装行业的尺码);去除购物车更新数量;更改订单号等。
1.JS商品全选功能 用代码编辑器打开/templets/plus/car.htm,在<head/>之前增加,
1.JS商品全选功能 用代码编辑器打开/templets/plus/car.htm,在<head/>之前增加,
<script language="javascript" type="text/javascript" src="{dede:global.cfg_templets_skin/}/js/jquery1.42.min.js"></script><!--引入jquery,文件放在在默认模板的js目录下-->
<!--全选s-->
<script type="text/javascript">
function selectGroup(checkbox,obj) {
$('input[name='+obj+']').attr('checked', $(checkbox).attr('checked'));
}
</script>
<!--全选e-->
找到下面代码,大概在54行,按指定位置增加
<!--以下列出购物车内购商品列表(数组),开始遍历数组-->
<tr>
<th width="23"><input type="checkbox" onclick="selectGroup(this,'ids[]');"/>选择</th>
<th width="23">编号</th>
2.JS自动增加减,统计购物数量及商品总价
<!--js加减s-->
<script type="text/javascript">
$(function(){
$(".add").click(function(){
var t=$(this).parent().find('input[class*=text_box]');
t.val(parseInt(t.val())+1)
setTotal();
})
$(".min").click(function(){
var t=$(this).parent().find('input[class*=text_box]');
t.val(parseInt(t.val())-1)
if(parseInt(t.val())<0){
t.val(0);
}
setTotal();
})
function setTotal(){
var s=0;
$("#tab .jg").each(function(){
s+=parseInt($(this).find('input[class*=text_box]').val())*parseFloat($(this).find('span[class*=price]').text());
});
var Num=0;
$("#tab .jg").each(function(){
Num+=parseInt($(this).find('input[class*=text_box]').val());
});
$("#total").html(s.toFixed(2)); //统计商品总价
$("#Num").html(Num.toFixed(2)); //统计购物数量
}
setTotal();
})
</script>
<!--js加减e-->
找到
<td height="23">
<input name="buynum{dede:value.id/}" type="text" id="buynum{dede:value.id/}" value="{dede:value.buynum/}" size="5" maxlength="5" class="ipt-txt" />
<small>{dede:value.units/}</small>
</td>
替换为
<td height="23" class="jg">
<!--加减s-->
<input class="min" name="" type="button" value="-" style="padding:0 5px;"/>
<input name="buynum{dede:value.id/}" type="text" id="buynum{dede:value.id/}" value="{dede:value.buynum/}" size="5" maxlength="5" class="text_box" />
<input class="add" name="" type="button" value="+" style="padding:0 3px;"/>
<!--加减e-->
<small>{dede:value.units/}</small>
</td>
找到
共 <font color=red>{dede:var.carts.cart_count/}</font> 件商品,合计:
<font color=red>{dede:var.carts.price_count/}</font>元
替换为
共 <font id="Num" color=red>{dede:var.carts.cart_count/}</font>件商品,合计:
<font id="total" color=red">{dede:var.carts.price_count/}</font>元
本文标签:
很赞哦! ()
图文教程
dede织梦5.7图集模型类栏目上传图片时出错,弹出302错误
解决办法在include/userlogin.class.php文件中的第二行session_start();前加上
织梦cmsdede百度编辑器上传图片没有自动加水印怎么办
dedecms整合Ueditor后,上传图片没有自动加水印,下面给大家讲讲解决办法:首先我们解决一下Ueditor抓取远程图片加水印的方法:
织梦cms实现针对搜索发布可搜多关键词及定栏目搜索
第一个红色字的0是一定要改,如果是1就会错误。参考高级搜索里这个是搜索关键字类型1是搜索你关键字或者相关文章0是搜索你关键字与之相关文章
怎么批量替换织梦dede所有文章来源和作者
DedeCms使用技巧:如何批量替换文章“来源”和“作者”1.打开DedeCMS网站根目录,找到 \templets\article_add.htm (发表普通模板)和article_edit.htm(修改普通模板)这两个文件,分别把:
相关源码
-
(带手机版)绿色生态农业种植农产品网站pbootcms源码下载本模板基于PbootCMS内核开发,为生态农业企业量身打造,适用于农业种植、有机农场、农产品电商等业务场景。模板设计充分体现绿色环保理念,突出农业特色,同时保持简洁大气的视觉效果,帮助农业企业建立专业形象。查看源码 -
(自适应)摄像头安防电子设备pbootcms源码下载本模板基于PbootCMS系统开发,为安防电子设备企业设计,特别适合监控摄像头、安防系统等产品的展示。采用响应式技术,确保各类设备参数和功能在不同终端上都能清晰呈现。查看源码 -
(响应式)蓝色智能摄像头安防防盗电子设备免费pbootcms源码下载这是一款针对智能安防行业特点设计的网站模板,采用蓝色系配色方案,体现科技感和安全性。模板包含产品展示、解决方案、技术支持和新闻中心等核心模块,能够全面展示智能安防设备的技术特点和行业应用。查看源码 -
(自适应)建站广告公司工作室作品展示品牌策划设计pbootcms源码下载基于PbootCMS开发的创意服务展示系统,内置作品集展示、服务流程图等专业模块,预设客户案例、设计流程等创意行业专属栏目结构。查看源码 -
(自适应)HTML5响应式双语绿色物流运输快递货运pbootcms源码本款基于PbootCMS开发的网站模板为物流运输、快递货运行业设计,采用HTML5技术构建,支持简繁字体切换。模板设计充分考虑了货运物流行业的特点,可专业展示运输服务、物流网络和业务优势等内容。查看源码 -
(自适应响应式)绿色环保防腐木材轻钢别墅建材pbootcms模板下载本模板为环保防腐木材、轻钢别墅建材类企业设计开发,基于PbootCMS内核构建,充分考虑了建材行业的展示需求与产品特点。模板设计风格自然环保,布局清晰合理,呈现建材产品特性与专业优势,帮助访客直观了解产品特点并建立信任感。查看源码
| 分享笔记 (共有 篇笔记) |
