实现购物车中数量的增减

最新推荐文章于 2022-10-26 11:43:02 发布

「已注销」

最新推荐文章于 2022-10-26 11:43:02 发布

阅读量2.4k

点赞数 2

分类专栏：实现购物车数量的增减文章标签：购物车

本文链接：https://blog.csdn.net/weixin_44110565/article/details/87386944

版权

本文探讨如何在电子商务应用中实现购物车中商品数量的增减功能，包括禁用点击事件的处理，确保用户能有效管理购物车内的商品数量。

摘要由CSDN通过智能技术生成

//HTML代码
<a href="javascript:;" class="num-minu">-</a>									//数量减
	<input type="text" pattern="[0-9]*" class="num" size="4" value="1">		//显示数量
<a href="javascript:;" class="num-add">+</a>									//数量加

//CSS代码，禁用点击事件
.disable {
	pointer-events: none;
}

//JS代码
<!--更新购物车里的数量-->
//点击数量减，input的数值减一，当input的小于等于1时给“ - ”添加一个类名为disable的类，通过css里的pointer-enents:none,禁用“ - ”的点击事件
        		$('.num-minu').click(function(){
        				console.log('你点击了数量减');
        				$(this).next().val(parseInt($(this).next().val())-1);
        				if($(this).next().val()<=1){
        					console.log('已经最低了')
        					$(this).addClass('disable')
        				}
        			})
//点击数量加，input的数值加一，当input的大于等于2时，将“ -