angularjs实现猜数字大小功能


Posted in Javascript onMay 20, 2020

本文实例为大家分享了angularjs实现猜数字大小功能的具体代码,供大家参考,具体内容如下

<body ng-app="myapp" ng-controller="myCtrl">
 <h2>猜一猜,多大值?(1-1000)</h2>
 我猜是:<input type="text" ng-model="guess">
 <button ng-click="check()">验证</button><button ng-click="reset()">再玩一次</button><br>
 <span ng-if="fil>0">您猜的数大了</span>
 <span ng-if="fil<0">您猜的数小了</span>
 <span ng-if="fil==0">您猜对了</span>
 <p>猜的次数<span>{{n}}</span></p>
</body>

js代码:

<script src="angular.min.js"></script>
 <script>
 var myapp=angular.module("myapp",[]);
 myapp.controller("myCtrl",function ($scope) {


//验证
  $scope.check=function () {
  console.log($scope.random); //根据差值判断显示、隐藏状态
  $scope.fil=$scope.guess-$scope.random;
  $scope.n++;

  };




//重置方法
  $scope.reset=function () {
  $scope.guess=null;
  $scope.fil=null;
  $scope.n = 0;




 //得到随机数
  $scope.random=Math.ceil(Math.random()*1000);
  };
  $scope.reset();
 })



 </script>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js传值 判断
Oct 26 Javascript
19个很有用的 JavaScript库推荐
Jun 27 Javascript
让JavaScript的Alert弹出框失效的方法禁止弹出警告框
Sep 03 Javascript
理解JavaScript的变量的入门教程
Jul 07 Javascript
讲解JavaScript的Backbone.js框架的MVC结构设计理念
Feb 14 Javascript
在AngularJS中使用jQuery的zTree插件的方法
Apr 21 Javascript
详解闭包解决jQuery中AJAX的外部变量问题
Feb 22 Javascript
vue图片加载与显示默认图片实例代码
Mar 16 Javascript
详解探索 vuex 2.0 以及使用 vuejs 2.0 + vuex 2.0 构建记事本应用
Jun 16 Javascript
JS实现点击循环切换显示内容的方法
Oct 19 Javascript
vue打包相关细节整理(小结)
Sep 28 Javascript
使用 JavaScript 创建并下载文件(模拟点击)
Oct 25 Javascript
angular指令笔记ng-options的使用方法
Sep 18 #Javascript
jQuery UI 实例讲解 - 日期选择器(Datepicker)
Sep 18 #jQuery
javascript  删除select中的所有option的实例
Sep 17 #Javascript
基于Node.js模板引擎教程-jade速学与实战1
Sep 17 #Javascript
浅谈函数调用的不同方式,以及this的指向
Sep 17 #Javascript
基于Bootstrap框架菜鸟入门教程(推荐)
Sep 17 #Javascript
基于js的变量提升和函数提升(详解)
Sep 17 #Javascript
You might like
全国FM电台频率大全 - 31 新疆维吾尔族自治区
2020/03/11 无线电
php 无限分类的树类代码
2009/12/03 PHP
php网站地图生成类示例
2014/01/13 PHP
PHP字符串中特殊符号的过滤方法介绍
2014/02/18 PHP
destoon整合ucenter后注册页面不跳转的解决方法
2014/06/21 PHP
PHP如何搭建百度Ueditor富文本编辑器
2018/09/21 PHP
浅析PHP 中move_uploaded_file 上传中文文件名失败
2019/04/17 PHP
JS写的数字拼图小游戏代码[学习参考]
2008/10/29 Javascript
解决遍历时Array.indexOf产生的性能问题
2012/07/03 Javascript
js实时获取系统当前时间实例代码
2013/06/28 Javascript
jQuery判断数组是否包含了指定的元素
2015/03/10 Javascript
详解js静态资源文件请求的处理
2017/08/01 Javascript
react-native使用react-navigation进行页面跳转导航的示例
2017/09/07 Javascript
IntelliJ IDEA 安装vue开发插件的方法
2017/11/21 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
2018/02/01 Javascript
vue ssr 实现方式(学习笔记)
2019/01/18 Javascript
详解ES6中的Map与Set集合
2019/03/22 Javascript
ES6中字符串的使用方法扩展
2019/06/04 Javascript
jquery轻量级数字动画插件countUp.js使用详解
2019/10/17 jQuery
在Python中操作文件之truncate()方法的使用教程
2015/05/25 Python
Python 比较两个数组的元素的异同方法
2017/08/17 Python
Flask模拟实现CSRF攻击的方法
2018/07/24 Python
Python3爬虫学习之将爬取的信息保存到本地的方法详解
2018/12/12 Python
Python图像处理库PIL的ImageFont模块使用介绍
2020/02/26 Python
实例讲解使用HTML5 Canvas绘制阴影效果的方法
2016/03/25 HTML / CSS
New Era英国官网:美国棒球帽品牌
2018/03/21 全球购物
卡西欧B级产品官方网站:Casio Outlet
2018/05/22 全球购物
瑞士最大的图书贸易公司:Orell Füssli
2019/12/28 全球购物
自考生自我鉴定范文
2013/10/01 职场文书
2014幼儿园卫生保健工作总结
2014/12/05 职场文书
写给老师的保证书
2015/05/09 职场文书
遗愿清单观后感
2015/06/09 职场文书
鉴史问廉观后感
2015/06/10 职场文书
教务处干事工作总结
2015/08/14 职场文书
导游词之四川武侯祠
2019/10/21 职场文书
Go timer如何调度
2021/06/09 Golang