AngularJS实现的生成随机数与猜数字大小功能示例
2017-12-25 14:39
991 查看
本文实例讲述了AngularJS实现的生成随机数与猜数字大小功能。分享给大家供大家参考,具体如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net Angular猜数</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的整数</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:这里再为大家提供几款相关在线工具供大家参考:
在线随机数字/字符串生成工具:
http://tools.jb51.net/aideddesign/suijishu
在线随机字符/随机密码生成工具:
http://tools.jb51.net/aideddesign/rnd_password
高强度密码生成器:
http://tools.jb51.net/password/CreateStrongPassword
更多关于AngularJS相关内容感兴趣的读者可查看本站专题:《AngularJS指令操作技巧总结》、《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》
希望本文所述对大家AngularJS程序设计有所帮助。
您可能感兴趣的文章:
相关文章推荐
- angularjs实现猜数字大小功能
- AngularJS基于http请求实现下载php生成的excel文件功能示例
- AngularJS实现进度条功能示例
- Angularjs实现带查找筛选功能的select下拉框示例代码
- PHP实现生成数据字典功能示例
- AngularJS实现的select二级联动下拉菜单功能示例
- Python实现的双色球生成功能示例
- JS实现随机数生成算法示例代码
- Python实现的生成格雷码功能示例
- Angularjs 实现分页功能及示例代码
- AngularJS实现的base64编码与解码功能示例
- AngularJS实现select的ng-options功能示例
- angularjs+生成随机数猜数字大小
- C#实现的简单随机数产生器功能示例
- AngularJS实现的输入框字数限制提醒功能示例
- Python实现随机生成有效手机号码及身份证功能示例
- ASP.NET实现的生成验证码功能示例【附demo源码】
- 使用PHP实现生成固定大小图片缩略图功能(智能裁剪,图片不失真)
- Android编程实现canvas绘制饼状统计图功能示例【自动适应条目数量与大小】