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>

  • 相关阅读:
    my ReadBook_dianzishangwu / 2020216 / dianzishangwuwuliu
    my ReadBook_shichangyingxiao / 2020208
    C#编写的clock
    Java建立JProgressBar
    java基本类型byte的取值范围
    正则表达式整理大全
    (C#)如何利用Graphics画出一幅图表
    设置鼠标可以移动窗体
    Java编程提高性能的26个方法
    数据加密工具设计经验
  • 原文地址:https://www.cnblogs.com/wsq110/p/7716305.html
Copyright © 2011-2022 走看看