axure购物车加减实现

简介: axure购物车加减实现

a767702b0299442791c9726e505c126e.png


实现目标:


  1. 加号或减号时鼠标悬浮变色

  2. 点击加号 +1减号 -1最小是0


步骤一: 放表单元件:加号、减号和输入框



414f844c78a846febd16ac0c8f7856bf.png


步骤二: 设置样式鼠标悬浮变色


528c2e55113247548c575bcbe7d3b635.png

36cddfbb0eb34dc48d5c245436e5e073.png



鼠标放上时:


da65b2065aaf4856a509cae10a4e5209.png


步骤三: 点击加号 +1

项目–>全局变量:新增全局变量:ShoppingCart 默认值为0

c0ae5ffe0b6e480f884bf1237ddced0d.png


加号添加点击事件:

70cc5e9b72fa473b952b971b1cbcc7b3.png


设置 变量ShoppingCart +1


设置输入框的值为 变量值ShoppingCart


步骤四: 点击减号 -1


同加号事件逻辑一直区别在于不能为负数所以加了条件,当变量为0时 输入框的值是0。


89b8e075353b4c01a52f0bf91409757e.png


相关文章
|
7月前
|
JavaScript PHP
技术笔记:sku加减号的增删
技术笔记:sku加减号的增删
|
7月前
|
程序员
程序员必知:商品放大镜的效果的实现!
程序员必知:商品放大镜的效果的实现!
37 0
Axure快速入门(09) -变量和表达式(计算商品总价例子)
Axure快速入门(09) -变量和表达式(计算商品总价例子)
229 0
|
JavaScript 前端开发
JavaScript实现购物车加减和价格运算等功能
JavaScript实现购物车加减和价格运算等功能
659 0
JavaScript实现购物车加减和价格运算等功能
|
存储 小程序
小程序实现购物车功能
购物车功能是电商小程序中比较常见的功能之一,实现起来也比较简单。通过本文的介绍,我们可以学习到如何将用户所选的商品信息保存在本地,如何展示商品信息,如何计算商品总价和总数,以及如何提供用户对购物车中商品的操作。在实际开发中,还可以根据具体需求进行定制和优化,例如添加优惠券、满减活动等功能,提升用户购物体验。
351 0
|
小程序 JavaScript
微信小程序购物车 数量加减功能
微信小程序购物车 数量加减功能
285 0
|
算法
代码随想录训练营day44| 518. 零钱兑换 II 377. 组合总和 Ⅳ
代码随想录训练营day44| 518. 零钱兑换 II 377. 组合总和 Ⅳ
132 0