尝试用js和jQuery实现一个简单的商品购买系统

 一、首先渲染出商品列表数据

 通过拼接和循环就得到表格了

添加一点简单的css样式让表格看得过去

 大概效果如图所示

这一步我们先获取当前点击的节点信息,然后通过js生成节点,再拼接到购物车表头下面

在做个判断,

先建立一个空数组,因为商品的编号是唯一的,所以点购买商品就判断一下数组里有没有商品的编号,有就value+1,否则就生成新的一行

 

通过some方法判断数组里的数有没有重复

 

 

加号和减号按钮绑定事件 

 

因为是渲染生产的,所有我直接给按钮里绑定了

 小计通过获取当前这一行的value和单价相乘,总价则获取所有的小计相加

通过数组做累加,每次改变都调用一次

 

 

这里通过正则和if判断一下就行,给输入框绑定事件

 当然为了总价小计不出错报错时给value更改为1

 

 删除按钮通过绑定事件来找到当前行在删除就行,再调用一下总价函数,还要记得清除数组里对应的数据

 

这样一个简单的商品购买系统就完成了