月考题

最新推荐文章于 2022-05-06 23:30:49 发布

浪徒

最新推荐文章于 2022-05-06 23:30:49 发布

阅读量288

点赞数

本文链接：https://blog.csdn.net/qq_38736020/article/details/78345417

版权

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
table{
width: 500px;

}
table ,tr ,td{
border: solid 1px grey;
border-collapse: collapse;
padding: 5px;

}
confirm{
top: 50px;
}

</style>
<script src="angular.min.js"></script>

<script>
var myapp=angular.module("myapp",[]);
myapp.controller("myCtrl",function ($scope) {
$scope.selectAll=false;

$scope.arr=[{checks:false,name:"qq",price:"530",number:"2",totalPrice:"100"}
,{checks:false,name:"qq",price:"900",number:"1",totalPrice:"100"}
,{checks:false,name:"rr",price:"650",number:"1",totalPrice:"100"}
,{checks:false,name:"ee",price:"580",number:"1",totalPrice:"100"}
,{checks:false,name:"ww",price:"480",number:"1",totalPrice:"100"}
,{checks:false,name:"hh",price:"980",number:"1",totalPrice:"100"}
,{checks:false,name:"cc",price:"440",number:"1",totalPrice:"100"}];

$scope.selectAllClick= function (sa) {

for(var i=0;i<$scope.arr.length;i++){
$scope.arr[i].checks=sa;
}
}
//加
$scope.jia=function (index) {
$scope.arr[index].number++;
get();
}
//减
$scope.jian=function (index) {
if( $scope.arr[index].number<=1){
if (confirm("确定要删除此商品")) {
$scope.arr.splice(index,1);
return;
}
}else{$scope.arr[index].number--;
get();}

}
//删除操作
$scope.shan=function (index) {
$scope.arr.splice(index,1);

}
//总价计算
$scope.zongjia=0;
var get=function () {
var zong=0
for(var i=0;i<$scope.arr.length;i++){
// $scope.s=$scope.arr[i].number*$scope.arr[i].price;

zong+=$scope.arr[i].number*$scope.arr[i].price;
}
$scope.zongjia=zong;

}
get();
//全删

$scope.quanshan=function () {
if (confirm("确定清除购物车")) {

$scope.arr=[];
return;
}
}

});

</script>
</head>
<body ng-app="myapp" ng-controller="myCtrl">
<h3>我的购物车</h3>

<button ng-click="quanshan()">清空购物车</button>
<table>
<thead>
<th><input type="checkbox" ng-model="selectAll" ng-click="selectAllClick(selectAll)"></th>
<th >name</th>
<th>price</th>
<th>

</th>
<th>totalPrice</th>
<th>option</th>
</thead>
<tbody>
<tr ng-repeat="i in arr">

<td><input type="checkbox" ng-checked="i.checks" ng-click="e"></td>
<td>{{i.name}}</td>
<td>{{i.price}}</td>
<td><button ng-click="jia($index)">+</button>{{i.number}}<button ng-click="jian($index)">-</button></td>

<td><span>￥</span>{{i.price*i.number}}</td>
<td><button ng-click="shan($index)">删除</button></td>

</tr>
<tr>
<td><span>总价：</span>{{zongjia}}</td>
</tr>

</tbody>

</table>
</body>
</html>