来源:互联网 发布:淘宝联盟保持高佣金 编辑:程序博客网 时间:2024/04/28 17:09
<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title>    <script type="text/javascript" src="angular-1.3.0.js"></script>    <script type="text/javascript" src="jquery.1.12.4.js"></script>    <style>       #ss tr:nth-child(even){            background-color: azure;        }       #ss tr:nth-child(odd){       }    </style>    <script type="text/javascript">        var app = angular.module("myapp",[]);        app.filter("specialChar", function () {            return function (value, flag) {                var chars = flag.split("|");                for (var i in chars) {                    if (value.indexOf(chars[i]) >= 0) {                        return "屏蔽该行,出现违规字符!";                    }                }                return value;            }        });        app.controller("myCtrl",function($scope){            $scope.user=[                {                    id:1,                    name:"张三",                    wei:"控球后卫",                    qiu:11,                    piao:1                },{                    id:2,                    name:"李四",                    wei:"大前锋",                    qiu:21,                    piao:2                },{                    id:3,                    name:"王五",                    wei:"小前锋",                    qiu:23,                    piao:7                },{                    id:4,                    name:"赵六",                    wei:"中锋",                    qiu:10,                    piao:6                },{                    id:5,                    name:"周七",                    wei:"得分后卫",                    qiu:1,                    piao:5                }            ];            var id=5;            $scope.addUserhehe=function(){                if($scope.a_name!=null&&$scope.a_name!=""&&$scope.a_name!=undefined&&$scope.a_wei!=null&&$scope.a_wei!=""&&$scope.a_wei!=undefined&&$scope.a_qiu!=null&&$scope.a_qiu!=""&&$scope.a_qiu!=undefined&&$scope.a_piao!=null&&$scope.a_piao!=""&&$scope.a_piao!=undefined){                    var bo=true;                    for(var i in $scope.user){                        if($scope.user[i].name==$scope.a_name){                            bo=false;                            break;                        }else{                            bo=true;                        }                    }                    if(bo){                        $scope.user.push({                            id:++id,                            name:$scope.a_name,                            wei:$scope.a_wei,                            qiu:$scope.a_qiu,                            piao:$scope.a_piao                        })                        $scope.a_name="";                        $scope.a_wei="";                        $scope.a_qiu="";                        $scope.a_piao="";                        $scope.addUserIsShow=false;                    }else{                        alert("已经有次名字了");                    }                }else{                    alert("所填项不能为空!");                }            };            var old_user=$scope.user;            $scope.xun=function(){                $scope.user=[];                var chars = $scope.cha.split("|");                if(chars=="习近平"||chars=="江泽民"){                    alert("出现违规字符!");                }else{                    for(var i in old_user){                        if(old_user[i].name==$scope.cha){                            $scope.user.push(old_user[i]);                        }                        if($scope.cha==null||$scope.cha==""||$scope.cha==undefined){                            $scope.user.push(old_user[i]);                        }                    }                }            }            $scope.add=function(){                $scope.addUserIsShow=true;            };        });    </script></head><body ng-app="myapp"><div></div><div ng-controller="myCtrl"><table>    <tr>        <td>查询</td>        <td>排序</td>    </tr>    <tr>        <td><input type="text" ng-model="cha" ng-change="xun()"></td>        <td>            <select ng-model="xuan" ng-change="search()">                <option value="-piao">票数倒序</option>                <option value="piao">票数正序</option>            </select>        </td>    </tr>    <tr>        <td><button style="background-color: aqua;padding: 2px 5px" ng-click="add()">新增学员</button></td>    </tr></table><table border="1" width="500px" id="ss">    <tr style="background-color: darkgray">        <td>姓名</td>        <td>位置</td>        <td>球号</td>        <td>票数</td>    </tr>    <tr ng-repeat="u in user| orderBy:xuan">        <td>{{u.name}}</td>        <td>{{u.wei}}</td>        <td>{{u.qiu}}</td>        <td>{{u.piao}}</td>    </tr></table>    <div ng-show="addUserIsShow">        <table>            <tr>                <td>用户名</td>                <td><input type="text" ng-model="a_name"></td>            </tr>            <tr>                <td>位置</td>                <td><input type="text" ng-model="a_wei"></td>            </tr>            <tr>                <td>球号</td>                <td><input type="text" ng-model="a_qiu"></td>            </tr>            <tr>                <td>票数</td>                <td><input type="number" ng-model="a_piao"></td>            </tr>            <tr>                <td colspan="2" align="center"><button ng-click="addUserhehe()">提交</button></td>            </tr>        </table>    </div></div></body></html>
原创粉丝点击