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 相关文章推荐
web页面数据展示新想法(json)
Jun 08 Javascript
Javascript中的delete操作符详细介绍
Jun 06 Javascript
简介JavaScript中valueOf()方法的使用
Jun 05 Javascript
js实现动态加载脚本的方法实例汇总
Nov 02 Javascript
基于jquery实现页面滚动时顶部导航显示隐藏
Apr 20 Javascript
基于jQuery实现瀑布流页面
Apr 11 jQuery
webpack打包react项目的实现方法
Jun 21 Javascript
AjaxFileUpload.js实现异步上传文件功能
Apr 19 Javascript
详解小程序云开发数据库
May 20 Javascript
vue element upload组件 file-list的动态绑定实现
Oct 11 Javascript
微信小程序背景音乐开发详解
Dec 12 Javascript
uniapp,微信小程序中使用 MQTT的问题
Jul 11 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写的采集程序
2007/03/16 PHP
使用php shell命令合并图片的代码
2011/06/23 PHP
PHP调用.NET的WebService 简单实例
2015/03/27 PHP
PHP实现的函数重载功能示例
2018/08/03 PHP
用javascript控制iframe滚动的代码
2007/04/10 Javascript
JavaScript的9个陷阱及评点分析
2008/05/16 Javascript
javascript 获取select下拉列表值的代码
2009/09/07 Javascript
jQuery Select(单选) 模拟插件 V1.3.62 改进版
2010/07/17 Javascript
JQuery 选择器、过滤器介绍
2011/02/14 Javascript
Extjs4.0设置Ext.data.Store传参的请求方式(默认为GET)
2013/04/02 Javascript
jquery ajax属性async(同步异步)示例
2013/11/05 Javascript
JS实现固定在右下角可展开收缩DIV层的方法
2015/02/13 Javascript
AngularJS使用angular-formly进行表单验证
2015/12/27 Javascript
Web打印解决方案之普通报表打印功能
2016/08/29 Javascript
JS继承之借用构造函数继承和组合继承
2016/09/07 Javascript
canvas实现弧形可拖动进度条效果
2017/05/11 Javascript
JavaScript反弹动画效果的实现代码
2017/07/13 Javascript
Node接收电子邮件的实例代码
2017/07/21 Javascript
浅谈JavaScript中的属性:如何遍历属性
2017/09/14 Javascript
vue项目中v-model父子组件通信的实现详解
2017/12/10 Javascript
vue.js整合mint-ui里的轮播图实例代码
2017/12/27 Javascript
python2.7的编码问题与解决方法
2016/10/04 Python
浅谈Python中带_的变量或函数命名
2017/12/04 Python
美国家具网站:Cymax
2016/09/17 全球购物
Jones New York官网:美国女装品牌,受白领女性欢迎
2019/11/26 全球购物
CSMA/CD介质访问控制协议
2015/11/17 面试题
实习销售业务员自我鉴定
2013/09/21 职场文书
淘宝客服自我总结鉴定
2014/01/25 职场文书
中青班党性分析材料
2014/02/16 职场文书
商场租赁意向书
2014/07/30 职场文书
乡镇精神文明建设汇报材料
2014/08/15 职场文书
纪检干部先进事迹材料
2014/08/23 职场文书
2014年实验室工作总结
2014/12/03 职场文书
后进生评语大全
2015/01/04 职场文书
学校节水倡议书
2015/04/29 职场文书
2015年乡镇党务公开工作总结
2015/05/19 职场文书