angularjs 猜数

来源：互联网发布：js正则表达式冒号编辑：程序博客网时间：2024/05/29 16:30
<!DOCTYPE html><html lang="en">   <head>      <meta charset="UTF-8">      <title>Title</title>      <style>         * {            margin: 0;            padding: 0;            font-size: 30px;         }                  input {            width: 400px;            height: 40px;            font-size: 30px;         }                  button {            width: 80px;            height: 50px;            border: 0;            text-align: center;            line-height: 50px;            background: darkblue;            color: #fff;            margin-left: 5px;         }         .check{            background-color: #aaf;         }         .reset{            background-color: #afa;         }         div{            width: 500px;            height: 50px;            background-color: #aaa;         }      </style>      <script src="angular.js"></script>      <script>         var myapp = angular.module("myapp", []);         myapp.controller("myCtrl", function($scope) {            $scope.check = function() {               //console.log($scope.random);               $scope.differ = $scope.guess - $scope.random;               $scope.num++;            };            $scope.reset = function() {               $scope.differ = null;//差值               $scope.guess = null;//猜的数               $scope.num = 0;//次数               $scope.random = Math.ceil(Math.random() * 10);//随机数，标准值            };            $scope.reset();         })      </script>   </head>   <body ng-app="myapp" ng-controller="myCtrl">      <center>         <h2>猜数游戏</h2>         <div>猜一猜，多大值？（1-10）</div><br/>         <input type="number" ng-model="guess">         <button ng-click="check()" class="check">检查</button>         <button ng-click="reset()" class="reset">重玩一次</button><br/><br/>         <p ng-if="differ>0">猜大了</p>         <p ng-if="differ<0">猜小了</p>         <p ng-if="differ==0">猜对了</p>         <p>一共猜了<span ng-bind="num"></span>次</p>      </center>   </body></html>
阅读全文
0 0