AngularJS基础 ng-keydown 指令简单示例


Posted in Javascript onAugust 02, 2016

AngularJS ng-keydown 指令

AngularJS 实例

按下按键时执行的代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">

<input ng-keydown="count = count + 1" ng-init="count=0" />

<h1>{{count}}</h1>

<p>该实例在输入框每次按下按键时,计算变量 "count" 会自动加 1。</p>

</body>
</html>

定义和用法

ng-keydown 指令用于告诉 AngularJS 在指定 HTML 元素上按下按键时需要的操作。

ng-keydown 指令不会覆盖元素的原生 onkeydown 事件, 事件触发时,ng-keydown 表达式与原生的 onkeydown 事件将都会执行。

按键敲击的事件顺序:

1.Keydown

2.Keypress

3.Keyup

语法

<element ng-keydown="expression"></element>

<input>, <select>, <textarea>, 和其他可编辑元素支持该指令。

参数值

 

描述
expression 按下按键执行的表达式。
Javascript 相关文章推荐
jquery text()要注意啦
Oct 30 Javascript
jquery.validate使用攻略 第二部
Jul 01 Javascript
JS实现的另类手风琴效果网页内容切换代码
Sep 08 Javascript
Jquery promise实现一张一张加载图片
Nov 13 Javascript
javascript运动框架用法实例分析(实现放大与缩小效果)
Jan 08 Javascript
JavaScript判断图片是否已经加载完毕的方法汇总
Feb 05 Javascript
vue-cli项目中使用公用的提示弹层tips或加载loading组件实例详解
May 28 Javascript
一文读懂ES7中的javascript修饰器
May 06 Javascript
JS模拟浏览器实现全局搜索功能
Sep 11 Javascript
实现vuex原理的示例
Oct 21 Javascript
vue封装自定义指令之动态显示title操作(溢出显示,不溢出不显示)
Nov 12 Javascript
浅谈JS的原型和原型链
Jun 04 Javascript
AngularJs自定义服务之实现签名和加密
Aug 02 #Javascript
浅谈Cookie的生命周期问题
Aug 02 #Javascript
jQuery实现的兼容性浮动层示例
Aug 02 #Javascript
AngularJS基础 ng-init 指令简单示例
Aug 02 #Javascript
JS判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)
Aug 02 #Javascript
基于Vue.js实现数字拼图游戏
Aug 02 #Javascript
js 获取范围内的随机数实例代码
Aug 02 #Javascript
You might like
php中mt_rand()随机数函数用法
2014/11/24 PHP
PHP版本常用的排序算法汇总
2015/12/20 PHP
[原创]PHP简单开启curl的方法(测试可行)
2016/01/11 PHP
jqPlot jquery的页面图表绘制工具
2009/07/25 Javascript
PHP 与 js的通信(via ajax,json)
2010/11/16 Javascript
关于图片按比例自适应缩放的js代码
2011/10/30 Javascript
JavaScript中用字面量创建对象介绍
2014/12/31 Javascript
jquery表格datatables实例解析 直接加载和延迟加载
2016/08/12 Javascript
JavaScript 2018 中即将迎来的新功能
2018/09/21 Javascript
解决微信小程序防止无法回到主页的问题
2018/09/28 Javascript
使用vue-cli脚手架工具搭建vue-webpack项目
2019/01/14 Javascript
vue中的双向数据绑定原理与常见操作技巧详解
2020/03/16 Javascript
[03:16]DOTA2完美大师赛小组赛精彩集锦
2017/11/22 DOTA
Python 文件读写操作实例详解
2014/03/12 Python
Python中属性和描述符的正确使用
2016/08/23 Python
解决python3 urllib 链接中有中文的问题
2018/07/16 Python
python使用thrift教程的方法示例
2019/03/21 Python
详解Django 时间与时区设置问题
2019/07/23 Python
Python列表原理与用法详解【创建、元素增加、删除、访问、计数、切片、遍历等】
2019/10/30 Python
python中的函数递归和迭代原理解析
2019/11/14 Python
Tensorflow 定义变量,函数,数值计算等名字的更新方式
2020/02/10 Python
PyCharm GUI界面开发和exe文件生成的实现
2020/03/04 Python
解决selenium+Headless Chrome实现不弹出浏览器自动化登录的问题
2021/01/09 Python
Python3使用Selenium获取session和token方法详解
2021/02/16 Python
GAP欧盟网上商店:GAP EU
2016/09/13 全球购物
怎样比较两个类型为String的字符串
2016/08/17 面试题
车间核算员岗位职责
2014/07/01 职场文书
励志演讲稿500字
2014/08/21 职场文书
银行柜员与客户起冲突检讨书
2014/09/27 职场文书
高中生旷课检讨书
2014/10/08 职场文书
年终工作总结范文2014
2014/11/27 职场文书
出纳年终工作总结2014
2014/12/05 职场文书
工作失职检讨书范文
2015/05/05 职场文书
雷锋观后感
2015/06/10 职场文书
演讲稿:​快乐,从不抱怨开始!
2019/04/02 职场文书
教你漂亮打印Pandas DataFrames和Series
2021/05/29 Python