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 09 Javascript
基于jquery的让textarea自适应高度的插件
Aug 03 Javascript
JavaScript动态调整TextArea高度的代码
Dec 28 Javascript
javascript学习笔记(九) js对象 设计模式
Jun 19 Javascript
js操纵dom生成下拉列表框的方法
Feb 24 Javascript
浅谈js的setInterval事件
Dec 05 Javascript
基于jQuery Circlr插件实现产品图片360度旋转
Sep 20 Javascript
基于jQuery实现文本框只能输入数字(小数、整数)
Jan 14 Javascript
使用node+vue.js实现SPA应用
Jan 28 Javascript
详解Angular 中 ngOnInit 和 constructor 使用场景
Jun 22 Javascript
微信小程序上传文件到阿里OSS教程
May 20 Javascript
后台使用freeMarker和前端使用vue的方法及遇到的问题
Jun 13 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实现中文圆形印章特效
2015/06/19 PHP
PHP串行化与反串行化实例分析
2016/12/27 PHP
php上传图片并给图片打上透明水印的代码
2010/06/07 Javascript
在浏览器窗口上添加遮罩层的方法
2012/11/12 Javascript
js 本地预览的简单实现方法
2014/02/18 Javascript
Javascript学习指南
2014/12/01 Javascript
js点击列表文字对应该行显示背景颜色的实现代码
2015/08/05 Javascript
JS简单生成两个数字之间随机数的方法
2016/08/03 Javascript
浅谈JavaScript的自动垃圾收集机制
2016/12/15 Javascript
详解基于angular路由的requireJs按需加载js
2017/01/20 Javascript
前端分页功能的实现以及原理(jQuery)
2017/01/22 Javascript
jQuery多选框选择数量限制方法
2017/02/08 Javascript
jQuery模拟窗口抖动效果
2017/03/15 Javascript
webpack独立打包和缓存处理详解
2017/04/03 Javascript
Javarscript中模块(module)、加载(load)与捆绑(bundle)详解
2017/05/28 Javascript
如何用原生js写一个弹窗消息提醒插件
2019/05/24 Javascript
详解Vue2的diff算法
2021/01/06 Vue.js
[00:27]DOTA2次级职业联赛 - Lilith战队宣传片
2014/12/01 DOTA
示例详解Python3 or Python2 两者之间的差异
2018/08/23 Python
python对html过滤处理的方法
2018/10/21 Python
Python lambda表达式用法实例分析
2018/12/25 Python
Python3列表List入门知识附实例
2020/02/09 Python
Python基于数列实现购物车程序过程详解
2020/06/09 Python
个人简历的自荐信
2013/10/23 职场文书
新闻专业本科生的自我评价分享
2013/11/20 职场文书
银行实习生的自我评价
2013/12/09 职场文书
优秀员工表扬信
2014/01/17 职场文书
小学生期末自我鉴定
2014/01/19 职场文书
路政管理毕业自荐书范文
2014/02/10 职场文书
《小儿垂钓》教学反思
2014/02/23 职场文书
老公保证书范文
2014/04/29 职场文书
庆七一活动简报
2015/07/20 职场文书
2016年小学六一儿童节活动总结
2016/04/06 职场文书
Nginx + consul + upsync 完成动态负载均衡的方法详解
2021/03/31 Servers
用python删除文件夹中的重复图片(图片去重)
2021/05/12 Python
ubuntu下常用apt命令介绍
2022/06/05 Servers