AngularJS基础 ng-focus 指令简单示例
AngularJS ng-focus 指令
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-focus="count = count + 1" ng-init="count=0" /> <h1>{{count}}</h1> <p>该实例在输入框每次获取焦点时,计算变量 "count" 会自动加 1。</p> </body> </html>
该实例在输入框每次获取焦点时,计算变量 "count" 会自动加 1。
定义和用法
ng-focus 指令用于告诉 AngularJS 在 HTML 元素获取焦点时需要执行的操作。
ng-focus 指令不会覆盖元素的原始 onfocus 事件, 事件触发时,ng-focus 表达式与原始的 onfocus 事件将都会执行。
语法
<element ng-focus="expression"></element>
<a>, <input>, <select>, <textarea>, 和 window 对象都支持该指令。
参数值
值 | 描述 |
---|---|
expression | 元素获取焦点时执行的表达式。 |
以上就是对Angular ng-focus 的基础资料整理,后续继续补充。
相关推荐
-
AngularJs自定义服务之实现签名和加密
写在前面: AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过 指令 扩展了 HTML,且通过 表达式 绑定数据到 HTML. angularJS是google公司主推的js开发优秀框架... 页面展示: 在应用中进行加密是普遍存在的,个人建议在前端实现加密签名(前端加密是否必要来自知乎:http://www.zhihu.com/question/25539382) 对base64.md5.sha1加密算法
-
AngularJS基础 ng-hide 指令用法及示例代码
AngularJS ng-hide 指令 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> &
-
AngularJS基础 ng-include 指令简单示例
AngularJS ng-include 指令 AngularJS 实例 包含 HTML 文件: <!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>
-
AngularJS基础 ng-if 指令用法
AngularJS ng-if 指令 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> <b
-
AngularJS基础 ng-disabled 指令详解及简单示例
AngularJS ng-disabled 指令 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> &
-
AngularJS控制器之间的数据共享及通信详解
AngularJS 本身已经提供了像指令 Directive 和 服务 Service 一类的方式,来实现数据和代码的共享和复用,但在实际的项目开发中,或许是处于懒惰,亦或是为了便利,总会想在两个控制器之间,直接进行数据的共享通信,或者是函数与方法的调用,这里我们就看看有哪些方法可以满足这个要求. 单例服务 单例服务是 AngularJS 本身支持的数据和代码共享方式,因为是单例的,所有的控制器访问的便是同一份数据.比如,下面的 Service 便可以实现: angular .module('a
-
AngularJS基础 ng-href 指令用法
AngularJS ng-href 指令 AngularJS 实例 使用 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> </hea
-
AngularJS基础 ng-init 指令简单示例
AngularJS ng-init 指令 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> &
-
AngularJS基础 ng-include 指令示例讲解
AngularJS ng-include 指令 AngularJS 实例 包含 HTML 文件: <!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>
-
AngularJS基础 ng-keydown 指令简单示例
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>
随机推荐
- SqlServer 在事务中获得自增ID的实例代码
- sql server 2005用户权限设置深入分析
- 一个软文贴是如何轻松吸引百万流量的
- Java数据结构及算法实例:插入排序 Insertion Sort
- 初步解析Java中AffineTransform类的使用
- DedeCMS dede_channeltype表字段注释
- mysql_fetch_row,mysql_fetch_array,mysql_fetch_assoc的区别
- DISCUZ在win2003环境下 Unable to access ./include/common.inc.php in... 的问题终极解决方案
- C语言找出数组中的特定元素的算法解析
- 文本框只能输入数字的js代码(含小数点)
- C++ 计数排序实例详解
- mssql自动备份及自动清除日志文件服务器设置
- SQL Server中Check约束的学习教程
- Hibernate批量处理海量数据的方法
- 计算100000数组js脚本的执行时间
- 深入理解JavaScript系列(15) 函数(Functions)
- BootStrapTable服务器分页实例解析
- ASP.NET加密解密算法分享
- 举例讲解C#中自动实现的属性
- Android实现类似于PC中的右键弹出菜单效果