zoukankan      html  css  js  c++  java
  • 新增球员

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
    table{
    border-collapse: collapse;
    }
    td{
    padding: 10px;
    border: 1px solid #000;
    }
    </style>
    <script src="../angular-1.5.5/angular.min.js"></script>
    <script>
    var myapp=angular.module("myapp",[]);
    myapp.controller("myCtrl",function($scope){
    $scope.data=[{
    name:"张三",
    wz:"控球后卫",
    num:"11",
    ps:"999"
    },{
    name:"李四",
    wz:"大前锋",
    num:"21",
    ps:"888"
    },{
    name:"王五",
    wz:"小前锋",
    num:"23",
    ps:"777"
    },{
    name:"赵六",
    wz:"中锋",
    num:"10",
    ps:"666"
    },{
    name:"周七",
    wz:"得分后卫",
    num:"1",
    ps:"555"
    }];
    $scope.search="";
    $scope.search2="";
    $scope.$watch("search",function(value){
    console.log(value);
    if(value.indexOf("枪")!=-1){
    alert("包含敏感字");
    $scope.search="";
    }else{
    $scope.search2=$scope.search;
    }
    });
    //选择排序部分
    $scope.sort="--请选择--";
    //$scope.revers=null;
    $scope.fun=function(){
    if($scope.sort!="--请选择--"){
    if($scope.sort=="票数倒序"){
    $scope.revers=true;
    }else if($scope.sort=="票数正序"){
    $scope.revers=false;
    }
    }
    };
    //新增球员部分
    $scope.show=false;
    $scope.add=function(){
    $scope.show=true;
    };
    $scope.push=function(){
    for(var i=0;i<$scope.data.length;i++){
    if($scope.name==$scope.data[i].name){
    alert("重复");
    return;
    }
    }
    $scope.data.push({name:$scope.name,wz:$scope.wz,num:$scope.num,ps:$scope.ps});
    };
    console.log(angular.isNumber(0));
    })
    </script>
    </head>
    <body ng-app="myapp" ng-controller="myCtrl">
    <span>查询</span>
    <input type="text" ng-model="search">
    <span>排序</span>
    <select ng-model="sort" ng-change="fun()">
    <option>--请选择--</option>
    <option>票数倒序</option>
    <option>票数正序</option>
    </select><br/>
    <button ng-click="add()">新增球员</button>
    <table>
    <thead>
    <tr>
    <td>姓名</td>
    <td>位置</td>
    <td>球号</td>
    <td>票数</td>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="item in data|filter:search2|orderBy:'ps':revers">
    <td>{{item.name}}</td>
    <td>{{item.wz}}</td>
    <td>{{item.num}}</td>
    <td>{{item.ps}}</td>
    </tr>
    </tbody>
    </table>
    <table ng-show="show">
    <tr>
    <td>姓名</td>
    <td><input type="text" ng-model="name"></td>
    </tr>
    <tr>
    <td>位置</td>
    <td><input type="text" ng-model="wz"></td>
    </tr>
    <tr>
    <td>球号</td>
    <td><input type="text" ng-model="num"></td>
    </tr>
    <tr>
    <td>票数</td>
    <td><input type="text" ng-model="ps"></td>
    </tr>
    <tr>
    <td colspan="2"><button ng-click="push()">添加</button></td>
    </tr>
    </table>
    </body>
    </html>

  • 相关阅读:
    系统吞吐量、TPS(QPS)、用户并发量、性能測试概念和公式
    限流实现与解决方案
    mysql事务,select for update,及数据的一致性处理
    **MySQL锁机制与用法分析**
    死锁的排查
    系统中异常的设计与处理
    Spring如何处理线程并发问题
    ThreadLocal作用、场景、原理
    Database Administration Statements
    mybatis 无法自动补全,没有获得dtd文件
  • 原文地址:https://www.cnblogs.com/wsq110/p/7716305.html
Copyright © 2011-2022 走看看