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 相关文章推荐
用JAVASCRIPT如何给<textarea></textarea>赋值
Apr 20 Javascript
jquery里的正则表达式说明
Aug 03 Javascript
JQuery循环滚动图片代码
Dec 08 Javascript
bootstrap table动态加载数据示例代码
Mar 25 Javascript
简单谈谈vue的过渡动画(推荐)
Oct 11 Javascript
详解为Bootstrap Modal添加拖拽的方法
Jan 05 Javascript
Angular @HostBinding()和@HostListener()用法
Mar 05 Javascript
微信小程序实现tab页面切换功能
Jul 13 Javascript
JS实现数组删除指定元素功能示例
Jun 05 Javascript
在vue中把含有html标签转为html渲染页面的实例
Oct 28 Javascript
浅谈v-for 和 v-if 并用时筛选条件方法
Nov 07 Javascript
使用 UniApp 实现小程序的微信登录功能
Jun 09 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 最大运行时间 max_execution_time修改方法
2010/03/08 PHP
php实现telnet功能示例
2014/04/08 PHP
php按字符无乱码截取中文的方法
2015/03/27 PHP
深入讲解PHP Session及如何保持其不过期的方法
2015/08/18 PHP
ZendFramework2连接数据库操作实例
2017/04/18 PHP
ThinkPHP框架结合Ajax实现用户名校验功能示例
2019/07/03 PHP
Yii框架中使用PHPExcel的方法分析
2019/07/25 PHP
Javascript alert消息换行的方法
2013/08/07 Javascript
jquery(hide方法)隐藏指定元素实例
2013/11/11 Javascript
jQuery动画特效实例教程
2014/08/29 Javascript
JQuery分屏指示器图片轮换效果实例
2015/05/21 Javascript
javascript常用经典算法实例详解
2015/11/25 Javascript
javascript中闭包(Closure)详解
2016/01/06 Javascript
Vue.js每天必学之表单控件绑定
2016/09/05 Javascript
jQuery checkbox选中问题之prop与attr注意点分析
2016/11/15 Javascript
HTML页面定时跳转方法解析(2种任选)
2016/12/22 Javascript
Javascript中常用类型的格式化方法小结
2016/12/26 Javascript
jQuery插件echarts设置折线图中折线线条颜色和折线点颜色的方法
2017/03/03 Javascript
Puppeteer环境搭建的详细步骤
2018/09/21 Javascript
Vue实现星级评价效果实例详解
2019/12/30 Javascript
Bootstrap FileInput实现图片上传功能
2021/01/28 Javascript
Python列表append和+的区别浅析
2015/02/02 Python
Python数据预处理之数据规范化(归一化)示例
2019/01/08 Python
Django使用中间件解决前后端同源策略问题
2019/09/02 Python
基于python计算并显示日间、星期客流高峰
2020/05/07 Python
Python unittest单元测试openpyxl实现过程解析
2020/05/27 Python
Python偏函数Partial function使用方法实例详解
2020/06/17 Python
amazeui树节点自动展开折叠面板并选中第一个树节点的实现
2020/08/24 HTML / CSS
应届毕业生自我鉴定范文
2013/12/27 职场文书
职业生涯规划书的格式
2013/12/29 职场文书
幼师自我鉴定
2014/02/01 职场文书
入党申请自荐书范文
2014/02/11 职场文书
弘扬焦裕禄精神践行三严三实心得体会
2014/10/13 职场文书
工作违纪检讨书范文
2015/01/26 职场文书
2015小学教育教学工作总结
2015/07/21 职场文书
职工趣味运动会开幕词
2016/03/04 职场文书