自学 js

最新推荐文章于 2022-08-15 13:02:39 发布

你的益达啊

最新推荐文章于 2022-08-15 13:02:39 发布

阅读量219

点赞数

分类专栏： Android 文章标签： 1

本文链接：https://blog.csdn.net/nideyida1/article/details/80177977

版权

Android 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			tr:nth-child(odd){
				background: gainsboro;
			}
			tr:nth-child(even){
				background: grey;
			}
			#aaa{
				margin-left: 420px;
				background: orange;
			}
			#gm{
				background: green;
			}
			#pre{
				margin-right: 200px;
				margin-top: 20px;
			}
			#next{
				margin-left: 200px;
				margin-top: 20px;
			}
			table{
				margin-top: 20px;
			}
		</style>
		<script src="../js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/angular.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			angular.module("myapp",[]).controller("myctrl",function($scope,$http){
				/*网络接口*/
				$http.get("http://result.eolinker.com/rR1VBtT56a6bb220c10b3d44b65b4787a8aec03c4ec32ce?uri=monthTest").then(function(success){
					$scope.shop=success.data;
				})
				/*批量删除*/
				$scope.alldel=function(){
					if($scope.shop.checked==false||$scope.shop.length==0){
						alert("请选择至少一条数据");
					}
					else if (confirm("你确定删除它们？")) {
						for (var i = 0; i < $scope.shop.length; i++) {
							if ($scope.shop[i].checked==true) {
								$scope.shop.splice(i,1);
								i--;
							}
						}
					}
				}
				/*全选*/
				$scope.allck=function(){
					var cks=$scope.ischeck;
					for (var i = 0; i < $scope.shop.length; i++) {
						$scope.shop[i].checked=cks;
					}
				}
				/*购买*/
				$scope.buy=function(index){
					var num=$scope.shop[index].number;
					if (num>0) {
						alert("购买成功");
						$scope.shop[index].number--;
						$scope.shop[index].sells++;
					}else{
						alert("库存不足");
					}
				}
			})
		</script>
	</head>
	<body ng-app="myapp" ng-controller="myctrl">
		<input type="text"  ng-model="sele" placeholder="输入关键字..."/>
		<button ng-click="selec=sele">搜索</button>
		<button ng-click="alldel()" id="aaa">批量删除</button>
		<br />
		<table border="1px" width="700px">
			<tr style="background: gray;">
				<td><input type="checkbox" ng-model="ischeck" ng-change="allck()"/></td>
				<td>商品名称</td>
				<td>
					商品价格
					<button ng-click="pxa='price';ss=!ss">排序</button>
				</td>
				<td>
					库存
					<button ng-click="pxb='number';sj=!sj">排序</button>
				</td>
				<td>
					月销量
					<button ng-click="pxc='sells';aa=!aa">排序</button>
				</td>
				<td>购买</td>
			</tr>
			<tr ng-repeat="s in shop|filter:selec|orderBy:pxa:ss|orderBy:pxb:sj|orderBy:pxc:aa">
				<td><input type="checkbox" ng-model="s.checked"/></td>
				<td>{{s.name}}</td>
				<td>{{s.price|currency:"￥"}}</td>
				<td>{{s.number}}</td>
				<td>{{s.sells}}</td>
				<td>
					<button ng-click="buy($index)" id="gm">购买</button>
				</td>
			</tr>
		</table>
		<button id="pre">上一页</button>
		<button id="next">下一页</button>
	</body>
</html>