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


Posted in Javascript onAugust 02, 2016

AngularJS ng-keypress 指令

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-keypress="count = count + 1" ng-init="count=0" />

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

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

</body>
</html>

定义和用法

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

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

按键敲击的事件顺序:

1.Keydown

2.Keypress

3.Keyup

语法

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

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

参数值

描述
expression 按下按键执行的表达式。
Javascript 相关文章推荐
js实现的下拉框二级联动效果
Apr 30 Javascript
Struts2+jquery.form.js实现图片与文件上传的方法
May 05 Javascript
js微信分享API
Oct 11 Javascript
html、css和jquery相结合实现简单的进度条效果实例代码
Oct 24 Javascript
Angular X中使用ngrx的方法详解(附源码)
Jul 10 Javascript
全面解析jQuery中的$(window)与$(document)的用法区别
Aug 15 jQuery
JavaScript中Object值合并方法详解
Dec 22 Javascript
原生JS实现的双色球功能示例
Feb 02 Javascript
详解在React里使用&quot;Vuex&quot;
Apr 02 Javascript
微信小程序踩坑记录之解决tabBar.list[3].selectedIconPath大小超过40kb
Jul 04 Javascript
webpack-url-loader 解决项目中图片打包路径问题
Feb 15 Javascript
详解Vue.js 作用域、slot用法(单个slot、具名slot)
Oct 15 Javascript
javascript将中国数字格式转换成欧式数字格式的简单实例
Aug 02 #Javascript
AngularJS基础 ng-keydown 指令简单示例
Aug 02 #Javascript
AngularJs自定义服务之实现签名和加密
Aug 02 #Javascript
浅谈Cookie的生命周期问题
Aug 02 #Javascript
jQuery实现的兼容性浮动层示例
Aug 02 #Javascript
AngularJS基础 ng-init 指令简单示例
Aug 02 #Javascript
JS判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)
Aug 02 #Javascript
You might like
杏林同学录(八)
2006/10/09 PHP
截获网站title标签之家内容的例子
2006/10/09 PHP
PHP使用CURL实现多线程抓取网页
2015/04/30 PHP
yii使用bootstrap分页样式的实例
2017/01/17 PHP
什么是json和jsonp,jQuery json实例详详细说明
2012/12/11 Javascript
基于jquery插件实现常见的幻灯片效果
2013/11/01 Javascript
JavaScript也谈内存优化
2014/06/06 Javascript
jQuery中[attribute=value]选择器用法实例
2014/12/31 Javascript
javascript实现仿腾讯游戏选择
2015/05/14 Javascript
jquery.map()方法的使用详解
2015/07/09 Javascript
javascript常用函数(1)
2015/11/04 Javascript
jQuery实现的调整表格行tr上下顺序
2016/01/10 Javascript
EasyUI Pagination 分页的两种做法小结
2016/07/09 Javascript
浅谈JS正则表达式的RegExp对象和括号的使用
2016/07/28 Javascript
Node.js 使用jade模板引擎的示例
2018/05/11 Javascript
vue+elementui通用弹窗的实现(新增+编辑)
2021/01/07 Vue.js
使用 Python 获取 Linux 系统信息的代码
2014/07/13 Python
python如何实现excel数据添加到mongodb
2015/07/30 Python
Python中__init__.py文件的作用详解
2016/09/18 Python
详解django中自定义标签和过滤器
2017/07/03 Python
浅谈python配置与使用OpenCV踩的一些坑
2018/04/02 Python
详解Python中的动态属性和特性
2018/04/07 Python
PyQt5响应回车事件的方法
2019/06/25 Python
python 多进程共享全局变量之Manager()详解
2019/08/15 Python
关于Numpy中的行向量和列向量详解
2019/11/30 Python
tensorflow 自定义损失函数示例代码
2020/02/05 Python
Tensorflow中的dropout的使用方法
2020/03/13 Python
Python第三方包PrettyTable安装及用法解析
2020/07/08 Python
HTML5开发动态音频图的实现
2020/07/02 HTML / CSS
销售高级职员求职信
2013/10/29 职场文书
保护环境倡议书100字
2014/05/19 职场文书
群教个人对照检查材料
2014/08/20 职场文书
2014党员干部四风问题对照检查材料思想汇报
2014/09/24 职场文书
人事任命通知书
2015/04/21 职场文书
KTV员工管理制度
2015/08/06 职场文书
大学学生会主席竞选稿怎么写?
2019/08/19 职场文书