zoukankan      html  css  js  c++  java
  • 添加新球员

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>模拟考试</title>
    <script src="../../angular-1.5.5/angular.js"></script>
    <script>
    var myapp=angular.module("myapp",[]);
    myapp.controller("myCtrl",function ($scope) {
    $scope.users=[
    {
    'url':"images/1.png",
    'name':"Westbrook",
    'wz':"得分后卫(SG)",
    "age":24,
    "qd":"雷霆",
    "page":1900
    },
    {
    'url':"images/2.png",
    'name':"James",
    'wz':"大前锋(PF)",
    "age":23,
    "qd":"骑士",
    "page":1900
    },
    {
    'url':"images/3.png",
    'name':"Curry",
    'wz':"得分后卫(SG)",
    "age":30,
    "qd":"勇士",
    "page":1800
    },
    {
    'url':"images/4.png",
    'name':"Harden",
    'wz':"小前锋(SG)",
    "age":13,
    "qd":"火箭",
    "page":1800
    },
    {
    'url':"images/5.png",
    'name':"Durant",
    'wz':"得分后卫(SG)",
    "age":35,
    "qd":"勇士",
    "page":1712
    }
    ];
    //添加
    $scope.name="";
    $scope.wz="";
    $scope.age="";
    $scope.qd="";
    $scope.add=function () {
    $scope.users.push({'url':"images/5.png",'name':$scope.name,'wz':$scope.wz,'age':$scope.age,'qd':$scope.qd})
    }

    });
    </script>
    </head>
    <body ng-app="myapp" ng-controller="myCtrl">
    <h2>添加新球员</h2>
    姓名:<input type="text"ng-model="name"><br>
    位置:<input type="text"ng-model="wz"><br>
    年龄:<input type="text"ng-model="age"><br>
    球队:<input type="text"ng-model="qd"><br>
    <button ng-click="add()">添加新球员</button><br>
    <h1>用户信息表</h1>
    <input type="text" placeholder="用户名查询" ng-model="select">
    年龄:<select>
    <option>--请选择--</option>
    <option>10-20</option>
    <option>20-30</option>
    <option>30-40</option>
    </select>
    <table border="1" cellspacing="0" cellpadding="5">
    <thead>
    <tr>
    <th>球员</th>
    <th>姓名</th>
    <th>位置</th>
    <th>年龄</th>
    <th>球队</th>
    <th>得票数</th>
    <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="item in users|filter:select">
    <td><img src="{{item.url}}"/> </td>
    <td>{{item.name}}</td>
    <td>{{item.wz}}</td>
    <td>{{item.age}}</td>
    <td>{{item.qd}}</td>
    <td>{{item.page}}</td>
    <td><button>投票</button></td>
    </tr>
    </tbody>
    </table>
    </body>
    </html>
  • 相关阅读:
    GridView多行表头合并
    Android开发一 什么是3G
    SQL 日期格式 问题
    ASP.NET中TextBox控件设置ReadOnly="true"后台取不到值
    服务器维护:FTP无法连接
    Android开发之旅:应用程序基础及组件
    Failed to create the Java Virtual Machine
    Android开发七 Android中的显示单位
    Excel 数据有效性,怎么提示指定的命名区域不存在?
    Android开发三 如何安装 Android SDK 和Eclipse 插件
  • 原文地址:https://www.cnblogs.com/wsq110/p/7710998.html
Copyright © 2011-2022 走看看