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 相关文章推荐
JavaScript入门教程(9) Document文档对象
Jan 31 Javascript
网页自动跳转代码收集
Sep 27 Javascript
在chrome中window.onload事件的一些问题
Mar 01 Javascript
javascript alert乱码的解决方法
Nov 05 Javascript
JavaScript自定义等待wait函数实例分析
Mar 23 Javascript
学习javascript面向对象 理解javascript对象
Jan 04 Javascript
深入理解node.js之path模块
May 03 Javascript
zTree 树插件实现全国五级地区点击后加载的示例
Feb 05 Javascript
Vue组件通信中非父子组件传值知识点总结
Dec 05 Javascript
Vue学习之组件用法实例详解
Jan 06 Javascript
封装 axios+promise通用请求函数操作
Aug 11 Javascript
解决vant-UI库修改样式无效的问题
Nov 03 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 模拟 asp.net webFrom 按钮提交事件的思路及代码
2013/12/02 PHP
Thinkphp中Create方法深入探究
2014/06/16 PHP
javascript css styleFloat和cssFloat
2010/03/15 Javascript
jQuery UI Datepicker length为空或不是对象错误的解决方法
2010/12/19 Javascript
jquery等宽输出文字插件使用介绍
2013/09/18 Javascript
几种设置表单元素中文本输入框不可编辑的方法总结
2013/11/25 Javascript
js中判断用户输入的值是否为空的简单实例
2013/12/23 Javascript
JS替换文本域内的回车示例
2014/02/18 Javascript
js禁止页面刷新与后退的方法
2015/06/08 Javascript
微信小程序技巧之show内容展示,上传文件编码问题
2017/01/23 Javascript
JavaScript基本类型值-Undefined、Null、Boolean
2017/02/23 Javascript
JS实现仿UC浏览器前进后退效果的实例代码
2017/07/17 Javascript
JS简单获得节点元素的方法示例
2018/02/10 Javascript
javascript实现贪吃蛇经典游戏
2020/04/10 Javascript
微信小程序实现购物车小功能
2020/12/30 Javascript
理解Python中的With语句
2015/02/02 Python
Python实现FTP上传文件或文件夹实例(递归)
2017/01/16 Python
关于Django外键赋值问题详解
2017/08/13 Python
Django处理文件上传File Uploads的实例
2018/05/28 Python
Python根据指定日期计算后n天,前n天是哪一天的方法
2018/05/29 Python
Python实现的json文件读取及中文乱码显示问题解决方法
2018/08/06 Python
python: 判断tuple、list、dict是否为空的方法
2018/10/22 Python
Python中flatten( )函数及函数用法详解
2018/11/02 Python
python pandas读取csv后,获取列标签的方法
2018/11/12 Python
解决vscode python print 输出窗口中文乱码的问题
2018/12/03 Python
python 输出所有大小写字母的方法
2019/01/02 Python
使用GitHub和Python实现持续部署的方法
2019/05/09 Python
Python实现元素等待代码实例
2019/11/11 Python
Python requests设置代理的方法步骤
2020/02/23 Python
理解Django 中Call Stack机制的小Demo
2020/09/01 Python
CSS3 清除浮动的方法示例
2018/06/01 HTML / CSS
英语专业毕业生求职信
2014/05/24 职场文书
共产党员公开承诺践诺书
2014/05/28 职场文书
六一亲子活动总结
2014/07/01 职场文书
药店促销活动策划方案
2014/08/24 职场文书
Pytest实现setup和teardown的详细使用详解
2021/04/17 Python