分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

用jquery 实现购物车里面的商品添加或者减少的功能

发布时间:2023-09-06 01:07责任编辑:蔡小小关键词:暂无标签
HTML
<div class="gw_num"><em class="jian">-</em><input type="text" value="1" class="num"/><em class="add">+</em></div>

css

.gw_num{border: 1px solid #dbdbdb;width: 110px;line-height: 26px;overflow: hidden;}.gw_num em{display: block;height: 26px;width: 26px;float: left;color: #7A7979;border-right: 1px solid #dbdbdb;text-align: center;cursor: pointer;}.gw_num .num{display: block;float: left;text-align: center;width: 52px;font-style: normal;font-size: 14px;line-height: 24px;border: 0;}.gw_num em.add{float: right;border-right: 0;border-left: 1px solid #dbdbdb;}

jQuery

$(document).ready(function(){//加的效果$(".add").click(function(){var n=$(this).prev().val();var num=parseInt(n)+1;if(num==0){ return;}$(this).prev().val(num);});//减的效果$(".jian").click(function(){var n=$(this).next().val();var num=parseInt(n)-1;if(num==0){ return}$(this).next().val(num);});})

用jquery 实现购物车里面的商品添加或者减少的功能

原文地址:http://www.cnblogs.com/shuangjiang/p/7453610.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved