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 相关文章推荐
JQuery 动态扩展对象之另类视角
May 25 Javascript
jquery获取ASP.NET服务器端控件dropdownlist和radiobuttonlist生成客户端HTML标签后的value和text值
Jun 28 Javascript
ExtJs的Date格式字符代码
Dec 30 Javascript
javascript jscroll模拟html元素滚动条
Dec 18 Javascript
js判读浏览器是否支持html5的canvas的代码
Nov 18 Javascript
jQuery中Ajax全局事件引用方式及各个事件(全局/局部)执行顺序
Jun 02 Javascript
jQuery中DOM节点删除之empty与remove
Jan 20 Javascript
javascript实现table单元格点击展开隐藏效果(实例代码)
Apr 10 Javascript
jQuery中的$是什么意思及 $. 和 $().的区别
Apr 20 jQuery
浅谈在不使用ssr的情况下解决Vue单页面SEO问题(2)
Nov 08 Javascript
详解写好JS条件语句的5条守则
Feb 28 Javascript
vue实现可移动的悬浮按钮
Mar 04 Vue.js
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
VML绘图板②脚本--VMLgraph.js、XMLtool.js
2006/10/09 PHP
PHP 实现字符串翻转(包含中文汉字)的实现代码
2017/04/01 PHP
PHP7如何开启Opcode打造强悍性能详解
2018/05/11 PHP
PHP设计模式(五)适配器模式Adapter实例详解【结构型】
2020/05/02 PHP
js下利用控制器载入对应脚本
2010/07/17 Javascript
12款经典的白富美型—jquery图片轮播插件—前端开发必备
2013/01/08 Javascript
构造函数+原型模式构造js自定义对象(最通用)
2014/05/12 Javascript
jQuery实现跨域
2015/02/03 Javascript
jQuery实现可高亮显示的二级CSS菜单效果
2015/09/01 Javascript
基于PHP和Mysql相结合使用jqGrid读取数据并显示
2015/12/02 Javascript
基于javascript数组实现图片轮播
2016/05/02 Javascript
Jquery ui datepicker设置日期范围,如只能隔3天【实现代码】
2016/05/04 Javascript
用nodejs的实现原理和搭建服务器(动态)
2016/08/10 NodeJs
form+iframe解决跨域上传文件的方法
2016/11/18 Javascript
jQuery实现6位数字密码输入框
2016/12/29 Javascript
webpack3+React 的配置全解
2017/08/21 Javascript
微信小程序实现跳转的几种方式总结(推荐)
2019/04/24 Javascript
layui table数据修改的回显方法
2019/09/04 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
2020/01/26 Javascript
JS实现简易贪吃蛇游戏
2020/08/24 Javascript
python将字典内容存入mysql实例代码
2018/01/18 Python
python实现AES和RSA加解密的方法
2019/03/28 Python
pycharm新建一个python工程步骤
2019/07/16 Python
解决Atom安装Hydrogen无法运行python3的问题
2019/08/28 Python
浅谈python之自动化运维(Paramiko)
2020/01/31 Python
OpenCV+python实现实时目标检测功能
2020/06/24 Python
python实现mask矩阵示例(根据列表所给元素)
2020/07/30 Python
python爬取网易云音乐热歌榜实例代码
2020/08/07 Python
Django restful framework生成API文档过程详解
2020/11/12 Python
澳洲国民品牌乡村路折扣店:Country Road & Trenery Outlet
2018/04/19 全球购物
哈曼俄罗斯官方网上商店:Harman.club
2020/07/24 全球购物
C++面试题目
2013/06/25 面试题
安全教育培训制度
2015/08/06 职场文书
CSS实现章节添加自增序号的方法
2021/06/23 HTML / CSS
自动在Windows中运行Python脚本并定时触发功能实现
2021/09/04 Python
Django + Taro 前后端分离项目实现企业微信登录功能
2022/04/07 Python