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 相关文章推荐
getElementByIdx_x js自定义getElementById函数
Jan 24 Javascript
PHP中使用微秒计算脚本执行时间例子
Nov 19 Javascript
移动设备web开发首选框架:zeptojs介绍
Jan 29 Javascript
JS实现弹出浮动窗口(支持鼠标拖动和关闭)实例详解
Aug 06 Javascript
javascript实现加载xml文件的方法
Nov 24 Javascript
js控住DOM实现发布微博效果
Aug 30 Javascript
Javascript实现倒计时(防页面刷新)实例
Dec 13 Javascript
微信小程序开发之Tabbar实例详解
Jan 09 Javascript
详解iframe跨域的几种常用方法(小结)
Apr 29 Javascript
Vue 无限滚动加载指令实现方法
May 28 Javascript
解决ant Design Search无法输入内容的问题
Oct 29 Javascript
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
Dec 15 Vue.js
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数组去重实例及分析
2013/11/26 PHP
四种php中webservice实现的简单架构方法及实例
2015/02/03 PHP
php中instanceof 与 is_a()区别分析
2015/03/03 PHP
简介WordPress中用于获取首页和站点链接的PHP函数
2015/12/17 PHP
PHP判断密码强度的方法详解
2017/05/26 PHP
php利用ffmpeg提取视频中音频与视频画面的方法详解
2017/06/07 PHP
PHP切割整数工具类似微信红包金额分配的思路详解
2019/09/18 PHP
php+mysql实现的无限分类方法类定义与使用示例
2020/05/27 PHP
精选的10款用于构建良好易用性网站的jQuery插件
2011/01/23 Javascript
javascript中style.left和offsetLeft的用法说明
2014/03/07 Javascript
查找Oracle高消耗语句的方法
2014/03/22 Javascript
jQuery实现字符串按指定长度加入特定内容的方法
2015/03/11 Javascript
JavaScript数据结构与算法之集合(Set)
2016/01/29 Javascript
jQuery ajax提交Form表单实例(附demo源码)
2016/04/06 Javascript
详解AngularJS 路由 resolve用法
2017/04/24 Javascript
Vue项目中跨域问题解决方案
2018/06/05 Javascript
JavaScript中变量、指针和引用功能与操作示例
2018/08/04 Javascript
JS实现利用闭包判断Dom元素和滚动条的方向示例
2019/08/26 Javascript
微信小程序云开发获取文件夹下所有文件(推荐)
2019/11/14 Javascript
[09:59]DOTA2-DPC中国联赛2月7日Recap集锦
2021/03/11 DOTA
Python tkinter模块弹出窗口及传值回到主窗口操作详解
2017/07/28 Python
python交易记录整合交易类详解
2019/07/03 Python
python利用openpyxl拆分多个工作表的工作簿的方法
2019/09/27 Python
基于python实现获取网页图片过程解析
2020/05/11 Python
卸载tensorflow-cpu重装tensorflow-gpu操作
2020/06/23 Python
东方电视购物:东方CJ
2016/10/12 全球购物
80年代复古T恤:TruffleShuffle
2018/07/02 全球购物
意大利包包和行李箱销售网站:Bagaglio.it
2021/03/02 全球购物
Java提供了哪些企业应用编程接口
2015/02/13 面试题
什么是TCP/IP
2014/07/27 面试题
大学生应聘推荐信范文
2013/11/19 职场文书
七年级地理教学反思
2014/01/26 职场文书
模具毕业生推荐信
2014/02/15 职场文书
借款协议书范本
2014/04/22 职场文书
无锡灵山大佛导游词
2015/02/09 职场文书
护士求职简历自我评价
2015/03/10 职场文书