今天,终于把购物车的js写完了,虽然不是我自己写出来的,但是也是在跟着老师写的基础上,然后再自己去写一遍,通过自己写的这一遍,发现了很多的问题,之前我只会一味的跟着老师去敲敲代码,然后课后也不会去再敲一遍,这样就很容易导致一个错误:我以为我学会了。因为跟着老师的思路写,我们肯定不会出错,然而当你按照自己的想法写的,你就不会有那么多的思路了,就像很简单的一个问题:”代码写错,或者漏写 '' ."号,导致代码运行不出,这的小问题,也许你想破脑袋都有很可能想不出,因为你会觉得,这么简单的问题,怎么可能会出错呢,可就是这么一些小小的问题,导致你的失败。今天就写这些代码,我花了一个上午的时间,在写之前,我总在想:有这个必要么?多去看几遍不就好了。经过了这一个上午的实验,我现在可以肯定的回答:“非常的有必要。”因此只有动手,你才会发现自己的错误,不然你看着这些完美的代码,只会洋洋得意的认为,我没错。
代码思路分析:
1.全选全不选功能 :就是把全选按钮(checkall)的状态赋值给 三个小的按钮(j-checkbox)就可以了
在这里面要明确checkall(全选)和j-checkbox(小按钮),然后分别给他们附上加载事件,
2.如果小复选框被选中的个数等于3 就应该把全选按钮选上,否则全选按钮不选。
3.增减商品数量模块 首先声明一个变量,当我们点击+号(increment),就让这个值++,然后赋值给文本框。
4.用户修改文本框的值 计算 小计模块
5.计算总计和总额模块
6.删除商品模块
7.更换选中的背景颜色
我在里面犯的最主要的错误就是:粗心。要么是忘了写加载函数,要么是忽略类名前面的".",这些因素,也是一直伴随着我十几年的 错误,如今,在新的学习上,又开始重蹈覆辙了,我也希望,通过今天的这番检测,我能够在今后的学习中,改正这些小毛病。
知识总结:
1.prop() 方法设置或返回被选元素的属性和值。
element.prop("属性名") 获取元素固有的属性值,
prop(" ", " ") 添加属性
console.log($(this).prop("checked")); //用来判断是否选中复选框
2.toFixed(2) 保留两位小数
3.parents() 表示父级的父级==parent().parent()
4.substr() 截取字符串