<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>购物车操作</title>
<style>
table tr:nth-child(even){ background-color: lightgray;}
tr button{ width: 30px;}
</style>
<script src="js/jquery-1.11.1.js"></script>
<script src="js/angular.min.js"></script>
<script>
var sapp=angular.module("myapp",[]);
sapp.controller("con",function($scope){
$scope.stus=[];
$scope.fen1="price";
$scope.fen2=true;
$scope.add=function(){
if ($scope.uname==undefined||$scope.uname==""|| $scope.uname.length<=2 || $scope.uname.length>20) {
alert("商品名称输入有误！");
}else if($scope.typee==undefined || $scope.typee.length<=2 || $scope.typee.length>20 || $scope.typee==""){
alert("商品类型输入有误！");
}else if($scope.price<0 || $scope.price==undefined){
alert("商品价格输入有误！");
}else{
if($scope.count==null){
$scope.count=1;
}
var good={name:$scope.uname,type:$scope.typee,price:$scope.price,count:$scope.count};
$scope.stus.push(good);
}
}
$scope.del=function(e){
// 判断是否删除
if (confirm("确认删除吗？")) {
$scope.stus.splice(e,1);
}
}
$scope.sum=function(){
var zo1=0;
for (var i in $scope.stus) {
zo1=zo1+$scope.stus[i].price*$scope.stus[i].count;
}
return zo1;
}
$scope.num=function(cc,i){
if($scope.stus[i].count>=1){
$scope.stus[i].count=$scope.stus[i].count+cc;
}else{
if(confirm("是否要删除该商品?")){
$scope.stus.splice(i,1);
}
}
}
})
</script>
</head>
<body ng-app="myapp" ng-controller="con">
商品名称:<input ng-model="uname"/>
类型:<input ng-model="typee"/>
价格:<input type="number" ng-model="price"/>
数量:<input type="number" ng-model="count"/> <button ng-click="add()">添加</button>
<table width="900" border="1" cellspacing="0">
<tr style="background-color: lightslategray;">
<th>商品序号</th>
<th>商品名称</th>
<th ng-click="fen1='price';fen2=!fen2">商品价格</th>
<th ng-click="fen1='count';fen2=!fen2">商品数量</th>
<th>商品类型</th>
<th>小计</th>
<th>操作</th>
</tr>
<tr ng-repeat="a in stus|orderBy:fen1:fen2">
<td>{{$index}}</td>
<td>{{a.name}}</td>
<td>{{a.price}}</td>
<td><button ng-click="num(-1,$index)">-</button><input style="width: 30px;" ng-model="a.count" /><button ng-click="num(1,$index)">+</button></td>
<td>{{a.type}}</td>
<td>{{a.price*a.count}}</td>
<td><button ng-click="del($index)" style="width: 50px;">删除</button></td>
</tr>
</table>
<p style="margin-left: 600px;">总计：{{sum()}}</p>
</body>
</html>
<html>
<head>
<meta charset="utf-8" />
<title>购物车操作</title>
<style>
table tr:nth-child(even){ background-color: lightgray;}
tr button{ width: 30px;}
</style>
<script src="js/jquery-1.11.1.js"></script>
<script src="js/angular.min.js"></script>
<script>
var sapp=angular.module("myapp",[]);
sapp.controller("con",function($scope){
$scope.stus=[];
$scope.fen1="price";
$scope.fen2=true;
$scope.add=function(){
if ($scope.uname==undefined||$scope.uname==""|| $scope.uname.length<=2 || $scope.uname.length>20) {
alert("商品名称输入有误！");
}else if($scope.typee==undefined || $scope.typee.length<=2 || $scope.typee.length>20 || $scope.typee==""){
alert("商品类型输入有误！");
}else if($scope.price<0 || $scope.price==undefined){
alert("商品价格输入有误！");
}else{
if($scope.count==null){
$scope.count=1;
}
var good={name:$scope.uname,type:$scope.typee,price:$scope.price,count:$scope.count};
$scope.stus.push(good);
}
}
$scope.del=function(e){
// 判断是否删除
if (confirm("确认删除吗？")) {
$scope.stus.splice(e,1);
}
}
$scope.sum=function(){
var zo1=0;
for (var i in $scope.stus) {
zo1=zo1+$scope.stus[i].price*$scope.stus[i].count;
}
return zo1;
}
$scope.num=function(cc,i){
if($scope.stus[i].count>=1){
$scope.stus[i].count=$scope.stus[i].count+cc;
}else{
if(confirm("是否要删除该商品?")){
$scope.stus.splice(i,1);
}
}
}
})
</script>
</head>
<body ng-app="myapp" ng-controller="con">
商品名称:<input ng-model="uname"/>
类型:<input ng-model="typee"/>
价格:<input type="number" ng-model="price"/>
数量:<input type="number" ng-model="count"/> <button ng-click="add()">添加</button>
<table width="900" border="1" cellspacing="0">
<tr style="background-color: lightslategray;">
<th>商品序号</th>
<th>商品名称</th>
<th ng-click="fen1='price';fen2=!fen2">商品价格</th>
<th ng-click="fen1='count';fen2=!fen2">商品数量</th>
<th>商品类型</th>
<th>小计</th>
<th>操作</th>
</tr>
<tr ng-repeat="a in stus|orderBy:fen1:fen2">
<td>{{$index}}</td>
<td>{{a.name}}</td>
<td>{{a.price}}</td>
<td><button ng-click="num(-1,$index)">-</button><input style="width: 30px;" ng-model="a.count" /><button ng-click="num(1,$index)">+</button></td>
<td>{{a.type}}</td>
<td>{{a.price*a.count}}</td>
<td><button ng-click="del($index)" style="width: 50px;">删除</button></td>
</tr>
</table>
<p style="margin-left: 600px;">总计：{{sum()}}</p>
</body>
</html>
313
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
