本文實例講述了AngularJS實現(xiàn)的生成隨機數(shù)與猜數(shù)字大小功能。分享給大家供大家參考,具體如下:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>m.survivalescaperooms.com Angular猜數(shù)</title> <style> *{ margin: 0; padding: 0; font-size: 30px; } input{ width: 500px; height: 50px; font-size: 30px; } button{ width: 80px; height: 50px; border: 0; text-align: center; line-height: 50px; background: darkblue; color: #fff; margin-left: 5px; } </style> <script src="angular/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"><h2>請輸入一個1-10的整數(shù)</h2><input type="text" ng-model="guess"><button ng-click="check()">檢查</button><button ng-click="reset()">重置</button><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></body></html>運行效果:


PS:這里再為大家提供幾款相關(guān)在線工具供大家參考:
在線隨機數(shù)字/字符串生成工具:
http://tools.VeVB.COm/aideddesign/suijishu
在線隨機字符/隨機密碼生成工具:
http://tools.VeVB.COm/aideddesign/rnd_password
高強度密碼生成器:
http://tools.VeVB.COm/password/CreateStrongPassword
更多關(guān)于AngularJS相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《AngularJS指令操作技巧總結(jié)》、《AngularJS入門與進(jìn)階教程》及《AngularJS MVC架構(gòu)總結(jié)》
希望本文所述對大家AngularJS程序設(shè)計有所幫助。
|
新聞熱點
疑難解答