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 相关文章推荐
jquery 仿QQ校友的DIV模拟窗口效果源码
Mar 24 Javascript
在多个页面使用同一个HTML片段的代码
Mar 04 Javascript
jQuery bind事件使用详解
May 05 Javascript
javascript设计模式之工厂模式示例讲解
Mar 04 Javascript
jQuery 1.9移除了$.browser可以使用$.support来替代
Sep 03 Javascript
BootStrap入门教程(三)之响应式原理
Sep 19 Javascript
JavaScript表单验证开发
Nov 23 Javascript
js实现数组和对象的深浅拷贝
Sep 30 Javascript
Vue2.X 通过AJAX动态更新数据
Jul 17 Javascript
js核心基础之构造函数constructor用法实例分析
May 11 Javascript
jQuery高级编程之js对象、json与ajax用法实例分析
Nov 01 jQuery
CKEditor扩展插件:自动排版功能autoformat插件实现方法详解
Feb 06 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
JavaScript自定义DateDiff函数(兼容所有浏览器)
2012/03/01 Javascript
jQuery中index()的用法分析
2014/09/05 Javascript
JavaScript+html5 canvas绘制的小人效果
2016/01/27 Javascript
JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解
2016/11/29 Javascript
Vue2.0实现将页面中表格数据导出excel的实例
2017/08/09 Javascript
详谈js中标准for循环与foreach(for in)的区别
2017/11/02 Javascript
详解VUE 对element-ui中的ElTableColumn扩展
2018/03/28 Javascript
详解Vue源码学习之双向绑定
2019/04/10 Javascript
监控Nodejs的性能实例代码
2019/07/02 NodeJs
Vue实现腾讯云点播视频上传功能的实现代码
2020/08/17 Javascript
[47:20]DAC2018 4.4 淘汰赛 Optic vs Mineski 第一场
2018/04/05 DOTA
[01:01]2020完美高校联赛(秋)西安落幕
2021/03/11 DOTA
Python对小数进行除法运算的正确方法示例
2014/08/25 Python
python模拟鼠标拖动操作的方法
2015/03/11 Python
简述Python2与Python3的不同点
2018/01/21 Python
tensorflow saver 保存和恢复指定 tensor的实例讲解
2018/07/26 Python
Python pickle模块实现对象序列化
2019/11/22 Python
python+selenium+chrome批量文件下载并自动创建文件夹实例
2020/04/27 Python
Python OpenCV实现测量图片物体宽度
2020/05/27 Python
如何从csv文件构建Tensorflow的数据集
2020/09/21 Python
pycharm 多行批量缩进和反向缩进快捷键介绍
2021/01/15 Python
使用canvas实现黑客帝国数字雨效果
2020/01/02 HTML / CSS
全球第二大家装零售商:Lowe’s
2018/01/13 全球购物
Manduka官网:瑜伽垫、瑜伽毛巾和服装
2018/07/02 全球购物
Lungolivigno Fashion官网:高级时装在线购物
2020/10/17 全球购物
北京华建集团SQL面试题
2014/06/03 面试题
优秀应届生推荐信
2013/11/09 职场文书
门卫人员岗位职责
2013/12/24 职场文书
校园网站的创业计划书范文
2013/12/30 职场文书
学习演讲稿范文
2014/05/10 职场文书
廉洁教育学习材料
2014/05/19 职场文书
群众路线查摆问题整改措施
2014/10/10 职场文书
电子商务实训报告总结
2014/11/05 职场文书
小学德育工作总结2015
2015/05/12 职场文书
学生会工作感言
2015/08/07 职场文书
小学英语新课改心得体会
2016/01/22 职场文书