jQuery实现的购物车物品数量加减功能代码


Posted in Javascript onNovember 16, 2016

本文实例讲述了jQuery实现的购物车物品数量加减功能。分享给大家供大家参考,具体如下:

今天网友翠儿在用Jquery实现购物车物品数量的加减特效的时候遇到问题来问我,我后来帮她解决了这个Jquery特效,现在把它整理出来分享给大家用,虽然功能比较简单,但是很实用。

主要包括了以下功能:

1、数量增加操作功能

2、数量减少操作功能

3、总价计算功能

4、自动判断数量到1的时候,减少操作按钮禁止点击,数量增加时自动恢复

5、保留小数点位数toFixed()函数非常实用

功能代码如下:

$(function(){
//获得文本框对象
var t = $("#text_box");
//数量增加操作
$("#add").click(function(){
t.val(parseInt(t.val())+1)
if (parseInt(t.val())!=1){
$('#min').attr('disabled',false);
}
setTotal();
})
//数量减少操作
$("#min").click(function(){
t.val(parseInt(t.val())-1);
if (parseInt(t.val())==1){
$('#min').attr('disabled',true);
}
setTotal();
})
//计算操作
function setTotal(){
$("#total").html((parseInt(t.val())*3.95).toFixed(2));//toFixed()是保留小数点的函数很实用哦
}
//初始化
setTotal();
})

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
js的写法基础分析
Jan 17 Javascript
JQuery中SetTimeOut传参问题探讨
May 10 Javascript
可自己添加html的伪弹出框实现代码
Sep 08 Javascript
纯js实现重发验证码按钮倒数功能
Apr 21 Javascript
Javascript动态创建表格及删除行列的方法
May 15 Javascript
两种js监听滚轮事件的实现方法
May 13 Javascript
AngularJs 延时器、计时器实例代码
Sep 16 Javascript
vue实现通讯录功能
Jul 14 Javascript
详解Vue SSR( Vue2 + Koa2 + Webpack4)配置指南
Nov 13 Javascript
Vue源码解析之Template转化为AST的实现方法
Dec 14 Javascript
vue以组件或者插件的形式实现throttle或者debounce
May 22 Javascript
Element-ui el-tree新增和删除节点后如何刷新tree的实例
Aug 31 Javascript
使用JavaScript获取URL中的参数(两种方法)
Nov 16 #Javascript
微信小程序 保留小数(toFixed)详细介绍
Nov 16 #Javascript
微信小程序 获取相册照片实例详解
Nov 16 #Javascript
js canvas仿支付宝芝麻信用分仪表盘
Nov 16 #Javascript
Javascript使用SWFUpload进行多文件上传
Nov 16 #Javascript
微信小程序教程之本地图片上传(leancloud)实例详解
Nov 16 #Javascript
Javascript使用uploadify来实现多文件上传
Nov 16 #Javascript
You might like
php使用ffmpeg获取视频信息并截图的实现方法
2016/05/03 PHP
jquery 使用点滴函数代码
2011/05/20 Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
2013/01/27 Javascript
javascript重写alert方法的实例代码
2013/03/29 Javascript
动态加载iframe时get请求传递中文参数乱码解决方法
2014/05/07 Javascript
很不错的两款Bootstrap Icon图标选择组件
2016/01/28 Javascript
JavaScript如何实现组合列表框中元素移动效果
2016/03/01 Javascript
jQuery短信验证倒计时功能实现方法详解
2016/05/25 Javascript
原生js实现tab选项卡切换
2020/03/23 Javascript
详解vue.js2.0父组件点击触发子组件方法
2017/05/10 Javascript
谈谈VUE种methods watch和compute的区别和联系
2017/08/01 Javascript
JS中利用swiper实现3d翻转幻灯片实例代码
2017/08/25 Javascript
Vue实现左右菜单联动实现代码
2018/08/12 Javascript
js中async函数结合promise的小案例浅析
2019/04/14 Javascript
JS实现的雪花飘落特效示例
2019/12/03 Javascript
[01:00:12]2018DOTA2亚洲邀请赛 4.7 淘汰赛 VP vs LGD 第一场
2018/04/09 DOTA
[44:41]Fnatic vs Liquid 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python 实现红包随机生成算法的简单实例
2017/01/04 Python
详谈Python3 操作系统与路径 模块(os / os.path / pathlib)
2018/04/26 Python
python3 requests库实现多图片爬取教程
2019/12/18 Python
解决HTML5中滚动到底部的事件问题
2019/08/22 HTML / CSS
html5中嵌入视频自动播放的问题解决
2020/05/25 HTML / CSS
Marriott中国:万豪国际酒店查询预订
2016/09/02 全球购物
Coccinelle官网:意大利的著名皮具品牌
2019/05/15 全球购物
澳大利亚珠宝商:Shiels
2019/10/06 全球购物
远东集团网络工程师面试题
2014/10/20 面试题
介绍一下Ruby的多线程处理
2013/02/01 面试题
采购部主管岗位职责
2014/01/01 职场文书
2014自荐信的写作技巧
2014/01/28 职场文书
计算机软件专业求职信
2014/06/10 职场文书
房屋转让协议书
2014/10/18 职场文书
2014年财务科工作总结
2014/11/11 职场文书
2014年物流工作总结
2014/11/25 职场文书
先进个人推荐材料
2014/12/29 职场文书
2015年党员创先争优承诺书
2015/01/22 职场文书
试用期自我评价怎么写
2015/03/10 职场文书