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 URL传中文参数引发的乱码问题
Sep 02 Javascript
JS Pro-深入面向对象的程序设计之继承的详解
May 07 Javascript
三种检测iPhone/iPad设备方向的方法
Apr 23 Javascript
深入浅析javascript中的作用域(推荐)
Jul 19 Javascript
js中的面向对象入门
Mar 06 Javascript
Vue底层实现原理总结
Feb 17 Javascript
Vue中使用sass实现换肤功能
Sep 07 Javascript
微信小程序实现打开并下载服务器上面的pdf文件到手机
Sep 20 Javascript
vue实现短信验证码输入框
Apr 17 Javascript
ES6 Generator基本使用方法示例
Jun 06 Javascript
基于Element封装一个表格组件tableList的使用方法
Jun 29 Javascript
在vue中使用cookie记住用户上次选择的实例(本次例子中为下拉框)
Sep 11 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
一个PHP的String类代码
2010/04/20 PHP
WordPres对前端页面调试时的两个PHP函数使用小技巧
2015/12/22 PHP
php面向对象的用户登录身份验证
2017/06/08 PHP
PHP超低内存遍历目录文件和读取超大文件的方法
2019/05/01 PHP
IE与firefox之jquery用法区别
2008/10/03 Javascript
如何创建一个JavaScript弹出DIV窗口层的效果
2013/09/25 Javascript
juery框架写的弹窗效果适合新手
2013/11/27 Javascript
javascript和jquery修改a标签的href属性
2013/12/16 Javascript
js和css写一个可以自动隐藏的悬浮框
2014/03/05 Javascript
用jQuery toggleClass 实现鼠标移上变色
2014/05/14 Javascript
jQuery验证插件 Validate详解
2014/11/20 Javascript
jquery插件hiAlert实现网页对话框美化
2015/05/03 Javascript
详解Vue使用 vue-cli 搭建项目
2017/04/20 Javascript
Express + Session 实现登录验证功能
2017/09/08 Javascript
JavaScript实现全选取消效果
2017/12/14 Javascript
利用Vue-draggable组件实现Vue项目中表格内容的拖拽排序
2019/06/07 Javascript
webpack 最佳配置指北(推荐)
2020/01/07 Javascript
[40:27]完美世界DOTA2联赛PWL S3 PXG vs GXR 第一场 12.19
2020/12/24 DOTA
Python中方法链的使用方法
2016/02/23 Python
Python程序中的观察者模式结构编写示例
2016/05/27 Python
Python OpenCV处理图像之图像像素点操作
2018/07/10 Python
python使用pandas处理大数据节省内存技巧(推荐)
2019/05/05 Python
Pycharm运行加载文本出现错误的解决方法
2019/06/27 Python
使用matplotlib绘制图例标签中带有公式的图
2019/12/13 Python
tensorflow之获取tensor的shape作为max_pool的ksize实例
2020/01/04 Python
Pytorch实验常用代码段汇总
2020/11/19 Python
Jmeter调用Python脚本实现参数互相传递的实现
2021/01/22 Python
Lime Crime官网:美国一家主打梦幻精灵系的彩妆品牌
2019/03/22 全球购物
本科生的职业生涯规划范文
2014/01/09 职场文书
中医临床专业自我鉴定范文
2014/01/15 职场文书
医药类个人求职的自我评价
2014/02/12 职场文书
2015年初三班主任工作总结
2015/05/21 职场文书
2019XX公司员工考核管理制度!
2019/08/07 职场文书
Python基础之常用库常用方法整理
2021/04/30 Python
python读取并查看npz/npy文件数据以及数据显示方法
2022/04/14 Python
java获取一个文本文件的编码(格式)信息
2022/09/23 Java/Android