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使用定时函数实现跳转到某个页面
Dec 25 Javascript
jquery序列化表单以及回调函数的使用示例
Jul 02 Javascript
13 款最热门的 jQuery 图像 360 度旋转插件推荐
Dec 09 Javascript
关于cookie的初识和运用(js和jq)
Apr 07 Javascript
JavaScript 继承详解(五)
Oct 11 Javascript
微信小程序开发之实现选项卡(窗口顶部TabBar)页面切换
Nov 25 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
May 01 Javascript
微信小程序 调用微信授权窗口相关问题解决
Jul 25 Javascript
JS 创建对象的模式实例小结
Apr 28 Javascript
vue之封装多个组件调用同一接口的案例
Aug 11 Javascript
关于element-ui表单中限制输入纯数字的解决方式
Sep 08 Javascript
vue3+typescript实现图片懒加载插件
Oct 26 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
PHP4中实现动态代理
2006/10/09 PHP
discuz的php防止sql注入函数
2011/01/17 PHP
基于Linux调试工具strace与gdb的常用命令总结
2013/06/03 PHP
php的mail函数发送UTF-8编码中文邮件时标题乱码的解决办法
2015/10/20 PHP
Javascript 函数对象的多重身份
2009/06/28 Javascript
javascript xml为数据源的下拉框控件
2009/07/07 Javascript
深入认识javascript中的eval函数
2009/11/02 Javascript
js showModalDialog参数的使用详解
2014/01/07 Javascript
Node调试工具JSHint的安装及配置教程
2014/05/27 Javascript
深入分析原生JavaScript事件
2014/12/29 Javascript
基于JavaScript实现自定义滚动条
2017/01/25 Javascript
node.js中EJS 模板快速入门教程
2017/05/08 Javascript
微信小程序实现点击按钮修改view标签背景颜色功能示例【附demo源码下载】
2017/12/06 Javascript
jQuery EasyUI 选项卡面板tabs的使用实例讲解
2017/12/25 jQuery
webpack external模块的具体使用
2018/03/10 Javascript
React Native中Mobx的使用方法详解
2018/12/04 Javascript
vue-cli点击实现全屏功能
2020/03/07 Javascript
详解ES6数组方法find()、findIndex()的总结
2020/05/12 Javascript
[51:39]DOTA2-DPC中国联赛 正赛 Magma vs LBZS BO3 第二场 2月7日
2021/03/11 DOTA
复制粘贴功能的Python程序
2008/04/04 Python
Python中的字典遍历备忘
2015/01/17 Python
Python之Web框架Django项目搭建全过程
2017/05/02 Python
在Pycharm中项目解释器与环境变量的设置方法
2018/10/29 Python
Python Numpy:找到list中的np.nan值方法
2018/10/30 Python
Django框架实现的简单分页功能示例
2018/12/04 Python
Python实现的远程文件自动打包并下载功能示例
2019/07/12 Python
Python3 JSON编码解码方法详解
2019/09/06 Python
Python搭建Keras CNN模型破解网站验证码的实现
2020/04/07 Python
python 数据库查询返回list或tuple实例
2020/05/15 Python
单身旅行者的单身假期:Just You
2018/04/08 全球购物
英国当代时尚和街头服饰店:18montrose
2018/12/15 全球购物
Lentiamo比利时:便宜的隐形眼镜
2020/02/14 全球购物
AJAX的全称是什么
2012/11/06 面试题
深入讲解数据库中Decimal类型的使用以及实现方法
2022/02/15 MySQL
Win11筛选键导致键盘失灵怎么解决? Win11关闭筛选键的技巧
2022/04/08 数码科技
Vue OpenLayer测距功能的实现
2022/04/20 Vue.js