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 相关文章推荐
javascript event 事件解析
Jan 31 Javascript
js用Date对象处理时间实现思路及代码
Jan 31 Javascript
jquery为页面增加快捷键示例
Jan 31 Javascript
JavaScript使用Max函数返回两个数字中较大数的方法
Apr 06 Javascript
javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别
Nov 13 Javascript
基于JS实现PHP的sprintf函数实例
Nov 14 Javascript
jQuery ajax提交Form表单实例(附demo源码)
Apr 06 Javascript
jQuery插件zTree实现清空选中第一个节点所有子节点的方法
Mar 08 Javascript
vue实现百度下拉列表交互操作示例
Mar 12 Javascript
微信小程序实现单列下拉菜单效果
Apr 25 Javascript
javascript导出csv文件(excel)的方法示例
Aug 25 Javascript
微信小程序批量上传图片到七牛(推荐)
Dec 19 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文件读写操作之文件写入代码
2011/01/13 PHP
php登陆页的密码处理方式分享
2013/10/14 PHP
PHP判断一个gif图片是否为动态图片的方法
2014/11/19 PHP
PHP类与对象后期静态绑定操作实例详解
2018/12/20 PHP
jQuery(1.6.3) 中css方法对浮动的实现缺陷分析
2011/09/09 Javascript
纯javascript判断查询日期是否为有效日期
2015/08/24 Javascript
Angular.js回顾ng-app和ng-model使用技巧
2016/04/26 Javascript
非常漂亮的相册集 使用jquery制作相册集
2016/04/28 Javascript
JS简单测试循环运行时间的方法
2016/09/04 Javascript
JS 拦截全局ajax请求实例解析
2016/11/29 Javascript
BootStrap 图片样式、辅助类样式和CSS组件的实例详解
2017/01/20 Javascript
JS实现匀加速与匀减速运动的方法示例
2017/09/04 Javascript
nodejs使用redis作为缓存介质实现的封装缓存类示例
2018/02/07 NodeJs
jQuery实现新闻播报滚动及淡入淡出效果示例
2018/03/23 jQuery
Vue iview-admin框架二级菜单改为三级菜单的方法
2018/07/03 Javascript
微信小程序提取公用函数到util.js及使用方法示例
2019/01/10 Javascript
微信小程序wxs实现吸顶效果
2020/01/08 Javascript
vue Treeselect下拉树只能选择第N级元素实现代码
2020/08/31 Javascript
[54:25]Ti4 循环赛第三日LGD vs MOUZ
2014/07/12 DOTA
[01:11:11]Alliance vs RNG 2019国际邀请赛淘汰赛 败者组BO1 8.20.mp4
2020/07/19 DOTA
Python列表append和+的区别浅析
2015/02/02 Python
python数据结构之图的实现方法
2015/07/08 Python
Mac 上切换Python多版本
2017/06/17 Python
Django 实现下载文件功能的示例
2018/03/06 Python
使用python实现ftp的文件读写方法
2019/07/02 Python
Django中间件基础用法详解
2019/07/18 Python
对Django中内置的User模型实例详解
2019/08/16 Python
pandas创建DataFrame的7种方法小结
2020/06/14 Python
css3 给页面加个半圆形导航条主要利用旋转和倾斜样式
2014/02/10 HTML / CSS
YSL圣罗兰美妆美国官网:Yves Saint Lauret US
2016/11/21 全球购物
Lookfantastic台湾:英国彩妆美发保养购物网
2018/03/26 全球购物
物业保安员岗位职责制度
2014/01/30 职场文书
行政专员岗位职责说明书
2014/09/01 职场文书
学校教师培训工作总结
2015/10/14 职场文书
音乐研修感悟
2015/11/18 职场文书
sql server删除前1000行数据的方法实例
2021/08/30 SQL Server