浅谈angularjs中响应回车事件


Posted in Javascript onApril 24, 2017

下面这个示例在输入框键入回车键或者点击按钮时,将输入框的值置为"Hello World!":(黄色背景内容为响应回车事件涉及到的代码)

<html ng-app="myApp">
<head>
  <meta charset="utf-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>angularjs-demo</title>
<script type="text/javascript" src="lib/angularjs/angular.min.js" charset="utf-8"></script>
</head>
<body ng-controller="ctrl">
<input type="text" ng-model="text1" ng-keyup="enterEvent($event)" />
<button ng-click="clickEvent()">test</button>
</body>
<script type="text/javascript">
var app = angular.module('myApp', [])
.controller('ctrl', function($scope){
  $scope.clickEvent = function() {
    $scope.text1 = "Hello world!";
  }
  
  $scope.enterEvent = function(e) {
    var keycode = window.event?e.keyCode:e.which;
    if(keycode==13){
      $scope.clickEvent();
    }
  }
  
});
</script>
</html>

以上这篇浅谈angularjs中响应回车事件就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery.ui.progressbar 中文文档
Nov 26 Javascript
js中的push和join方法使用介绍
Oct 08 Javascript
jquery简单实现外部链接用新窗口打开的方法
May 30 Javascript
让图片跳跃起来  javascript图片轮播特效
Feb 16 Javascript
使用Javascript监控前端相关数据的代码
Oct 27 Javascript
js前端日历控件(悬浮、拖拽、自由变形)
Mar 02 Javascript
简单实现js上传文件功能
Aug 21 Javascript
vue-cli中的webpack配置详解
Sep 25 Javascript
详解Vue路由钩子及应用场景(小结)
Nov 07 Javascript
JS正则表达式封装与使用操作示例
May 15 Javascript
layui表格内放置图片,并点击放大的实例
Sep 10 Javascript
JavaScript实现动态留言板
Mar 16 Javascript
老生常谈angularjs中的$state.go
Apr 24 #Javascript
使用ionic播放轮询广告的实现方法(必看)
Apr 24 #Javascript
详谈angularjs中路由页面强制更新的问题
Apr 24 #Javascript
Angular中使用$watch监听object属性值的变化(详解)
Apr 24 #Javascript
关于angular js_$watch监控属性和对象详解
Apr 24 #Javascript
Javascript操作dom对象之select全面解析
Apr 24 #Javascript
Node+Express+MongoDB实现登录注册功能实例
Apr 23 #Javascript
You might like
PHP 中执行系统外部命令
2006/10/09 PHP
PHP编实现程动态图像的创建代码
2008/09/28 PHP
php入门学习知识点六 PHP文件的读写操作代码
2011/07/14 PHP
PHP数组无限分级数据的层级化处理代码
2012/12/29 PHP
深入PHP与浏览器缓存的分析
2013/06/03 PHP
PHP经典面试题之设计模式(经常遇到)
2015/10/15 PHP
实例讲解YII2中多表关联的使用方法
2017/07/21 PHP
教你如何解密js/vbs/vbscript加密的编码异处理小结
2008/06/25 Javascript
jQuery对象和DOM对象相互转化
2009/04/24 Javascript
Javascript string 扩展库代码
2010/04/09 Javascript
JavaScript高级程序设计 读书笔记之十 本地对象Date日期
2012/02/27 Javascript
Javascript自定义函数判断网站访问类型是PC还是移动终端
2014/01/10 Javascript
javascript(js)的小数点乘法除法问题详解
2014/03/07 Javascript
jQuery插件formValidator实现表单验证
2016/05/23 Javascript
详解JavaScript权威指南之对象
2016/09/27 Javascript
原生JS实现隐藏显示图片 JS实现点击切换图片效果
2021/01/27 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
2017/09/12 Javascript
jQuery zTree搜索-关键字查询 递归无限层功能实现代码
2018/01/25 jQuery
解决vue页面DOM操作不生效的问题
2018/03/17 Javascript
jQuery基于闭包实现的显示与隐藏div功能示例
2018/06/09 jQuery
Vue递归实现树形菜单方法实例
2018/11/06 Javascript
JavaScript中判断为整数的多种方式及保留两位小数的方法
2019/09/09 Javascript
js实现金山打字通小游戏
2020/07/24 Javascript
[05:46]DOTA2英雄梦之声_第18期_陈
2014/06/20 DOTA
[11:44]Ti9 OG夺冠时刻
2019/08/25 DOTA
基于MTCNN/TensorFlow实现人脸检测
2018/05/24 Python
python3解析库BeautifulSoup4的安装配置与基本用法
2018/06/26 Python
python3实现点餐系统
2019/01/24 Python
使用pyinstaller逆向.pyc文件
2019/12/20 Python
巴西葡萄酒商店:Divvino
2020/02/22 全球购物
工程力学硕士生的自我评价范文
2013/11/16 职场文书
参观考察邀请函范文
2014/01/29 职场文书
素质教育标语
2014/06/27 职场文书
使用Python的开发框架Brownie部署以太坊智能合约
2021/05/28 Python
Redis全局ID生成器的实现
2022/06/05 Redis
MySQL解决Navicat设置默认字符串时的报错问题
2022/06/16 MySQL