zoukankan      html  css  js  c++  java
  • angularjs事例

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Guess The Number !</title>
    <link href="bootstrap.min.css" rel="stylesheet">
    </head>

    <body ng-app="app">
    <div class="container" ng-controller="GuessTheNumberController">
    <h2>猜数字 !</h2>
    <p class="well lead">请猜出电脑生成的随机数,它的范围在1到1000之间.</p>
    <label>请您出手: </label><input type="number" ng-model="guess"/>
    <button ng-click="verifyGuess()" class="btn btn-primary btn-sm">确定</button>
    <button ng-click="initializeGame()" class="btn btn-warning btn-sm">重来</button>
    <p>
    <p ng-show="deviation<0" class="alert alert-warning">爷,您出价过高了!</p>
    <p ng-show="deviation>0" class="alert alert-warning">爷,少了点,再加点,再加点.</p>
    <p ng-show="deviation===0" class="alert alert-success">爷,还真让您说准了!.</p>
    </p>
    <p class="text-info">您猜过的次数是 : <span class="badge">{{numOfTries}}</span><p>
    </div>
    <script src="angular.js"></script>
    <script type="text/javascript">
    angular.module('app',[])
    .controller('GuessTheNumberController', GuessTheNumberController);

    function GuessTheNumberController($scope) {
    $scope.verifyGuess = function () {
    $scope.deviation = $scope.originalVal - $scope.userGuess;
    $scope.numOfTries = $scope.numOfTries + 1;
    }
    $scope.initializeGame=function() {
    $scope.numOfTries = 0;
    $scope.originalVal = Math.floor((Math.random() * 1000) + 1);
    $scope.userGuess = null;
    $scope.deviation = null;
    }
    alert("1");
    }
    </script>
    </body>
    </html>

  • 相关阅读:
    快速排序?
    算法和数据结构?
    渲染一个react?
    移动端兼容适配?
    PWA全称Progressive Web App,即渐进式WEB应用?
    InnoDB一棵B+树可以存放多少行数据?
    移动端首屏优化?
    InnoDB什么时候会锁表?
    数组去重,多种方法?
    如何处理异形屏iphone X?
  • 原文地址:https://www.cnblogs.com/LGDD/p/7169728.html
Copyright © 2011-2022 走看看