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


Posted in Javascript onAugust 01, 2016

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 的基础资料整理,后续继续补充。

Javascript 相关文章推荐
jquery jqPlot API 中文使用教程(非常强大的图表工具)
Aug 15 Javascript
jquery数据验证插件(自制,简单,练手)实例代码
Oct 24 Javascript
js中定义一个变量并判断其是否为空的方法
May 13 Javascript
jQuery实现的手机发送验证码倒计时效果代码分享
Aug 24 Javascript
JavaScript操作 url 中 search 部分方法函数
Jun 15 Javascript
使用jQuery的toggle()方法对HTML标签进行显示、隐藏的方法(示例)
Sep 01 Javascript
详解.vue文件中监听input输入事件(oninput)
Sep 19 Javascript
小程序ios音频播放没声音问题的解决
Jul 11 Javascript
详解javascript appendChild()的完整功能
Aug 18 Javascript
详解Vue CLI 3.0脚手架如何mock数据
Nov 23 Javascript
JavaScript多种滤镜算法实现代码实例
Dec 10 Javascript
使用Karma做vue组件单元测试的实现
Jan 16 Javascript
JavaScript中的对象继承关系
Aug 01 #Javascript
jQuery简单实现页面元素置顶时悬浮效果示例
Aug 01 #Javascript
jQuery Ajax 加载数据时异步显示加载动画
Aug 01 #Javascript
jQuery简单实现title提示效果示例
Aug 01 #Javascript
jQuery Ajax 异步加载显示等待效果代码分享
Aug 01 #Javascript
AngularJS基础 ng-disabled 指令详解及简单示例
Aug 01 #Javascript
jQuery获取与设置iframe高度的方法
Aug 01 #Javascript
You might like
PHP通过COM使用ADODB的简单例子
2006/12/31 PHP
PHP下一个非常全面获取图象信息的函数
2008/11/20 PHP
PHP session文件独占锁引起阻塞问题解决方法
2015/05/12 PHP
PHP函数超时处理方法
2016/02/14 PHP
php封装的page分页类完整实例代码
2020/02/01 PHP
js获取单元格自定义属性值的代码(IE/Firefox)
2010/04/05 Javascript
js对象数组按属性快速排序
2011/01/31 Javascript
jQuery的12招常用技巧分享
2011/08/08 Javascript
动态加载js和css(外部文件)
2013/04/17 Javascript
不使用ajax实现无刷新提交表单
2014/12/21 Javascript
javascript实现动态表头及表列的展现方法
2015/07/14 Javascript
jQuery的position()方法详解
2015/07/19 Javascript
全面解析Bootstrap中scrollspy(滚动监听)的使用方法
2016/06/06 Javascript
javascript实现无法关闭的弹框
2016/11/27 Javascript
基于javascript实现按圆形排列DIV元素(二)
2016/12/02 Javascript
js实现弹窗暗层效果
2017/01/16 Javascript
原生JavaScript实现Tooltip浮动提示框特效
2017/03/07 Javascript
Express+Nodejs 下的登录拦截实现代码
2017/07/01 NodeJs
通过命令行创建vue项目的方法
2017/07/20 Javascript
vue.js组件vue-waterfall-easy实现瀑布流效果
2017/08/22 Javascript
使用vue-infinite-scroll实现无限滚动效果
2018/06/22 Javascript
element-ui表格合并span-method的实现方法
2019/05/21 Javascript
使用axios请求时,发送formData请求的示例
2019/10/29 Javascript
详解Angular Karma测试的持续集成实践
2019/11/15 Javascript
原生js实现分页效果
2020/09/23 Javascript
微信小游戏中three.js离屏画布的示例代码
2020/10/12 Javascript
[02:41]DOTA2英雄基础教程 冥魂大帝
2014/01/16 DOTA
[03:16]DOTA2完美大师赛主赛事首日集锦
2017/11/23 DOTA
[36:29]2018DOTA2亚洲邀请赛 4.1 小组赛 A组加赛 LGD vs TNC
2018/04/02 DOTA
利用pandas读取中文数据集的方法
2018/07/25 Python
python识别图像并提取文字的实现方法
2019/06/28 Python
2014政务公开实施方案
2014/02/19 职场文书
2014年最新学校运动会广播稿
2014/09/17 职场文书
十佳少年事迹材料
2014/12/25 职场文书
大学入学感言
2015/08/01 职场文书
分析Netty直接内存原理及应用
2021/06/14 Java/Android