您现在的位置是:首页 > 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>元
本文标签:
很赞哦! ()
图文教程
织梦dedecms文章页调用tag关键词的方法
这个方法在帮助模板里面找到的,只是织梦默认模板没有调用。我们只需要对模板文件进行简单的修改即可调用。1、打开文章页模板文件templets/default
织梦dedecms系统无此标签,可能已经移除的解决方法
该问题可能出现的前提一:DEDECMS标签中包含“大写字母”在网站根目录下找到tags.php 此文件,将以下代码替换掉:
织梦dedecms获取上一篇下一篇文章链接代码实例
我们知道,在文章页调用前后文章的链接和标题,dedecms默认上一篇和下一篇的标签分别为有时出于需要,我们只需要链接而不用标题,要怎么操作呢?大家应该能想到要用正则吧?没错!下面给出最终实现代码。
不花钱怎么推广,不花钱的推广方法
现在的网络推广层出不群,大致可以分为两类:第一,是需要资金投入的推广;第二,则是免费的推广。
相关源码
-
pbootcms模板(PC+WAP)APP应用软件下载类官网源码为APP应用软件官网打造的响应式解决方案,PC端与移动端(WAP)数据实时同步,一次更新全网生效,满足多终端用户无缝体验需求。查看源码 -
(自适应)大气网络公司工作室个人作品展示网站模板免费下载基于PbootCMS内核开发的响应式网站模板,为网络技术服务类企业打造,具备高度可定制性。通过简洁现代的设计语言展现企业专业形象,后台数据实时同步机制确保多终端内容一致性,查看源码 -
WordPress主题模板JustNews资讯博客类源码V5.2.2JustNews主题针对博客创作、自媒体运营及资讯发布类网站的需求而设计,提供专业的内容展示与管理方案。该主题集成前端用户中心功能,支持用户在前端界面发布和投稿文章,操作流程简洁高效。查看源码 -
(响应式H5)帝国cms7.5文章新闻博客模板带会员中心本模板基于帝国CMS内核开发,为新闻资讯、个人博客及作品展示类网站设计。采用响应式布局技术,确保在手机、平板和电脑等不同设备上都能获得良好的浏览体验。查看源码 -
(自适应)水墨风中药馆中医名医介绍pbootcms网站模板本模板基于PbootCMS内核开发,为中医馆、中医药企业量身定制,可快速搭建具有传统文化特色的官方网站。自适应手机端设计,数据实时同步,助您高效展示中医特色诊疗、中药产品、养生知识等内容,塑造专业品牌形象。查看源码 -
(自适应)橙色家政服务清洁保洁服务pbootcms网站模板源码下载模板核心价值:基于PbootCMS内核开发的家政服务类网站模板,通过模块化设计展现服务项目、团队风采、服务案例等核心板块,突出时效预约、服务标准化展示等家政行业特性。查看源码
| 分享笔记 (共有 篇笔记) |
