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 相关文章推荐
javascript (用setTimeout而非setInterval)
Dec 28 Javascript
jQuery基于图层模仿五星星评价功能的方法
May 07 Javascript
Javascript基于AJAX回调函数传递参数实例分析
Dec 15 Javascript
基于jquery实现的仿优酷图片轮播特效代码
Jan 13 Javascript
js简单时间比较的方法
Aug 02 Javascript
jQuery中get方法用法分析
Dec 07 Javascript
js实现将json数组显示前台table中
Jan 10 Javascript
原生JS实现跑马灯效果
Feb 20 Javascript
Angular实现较为复杂的表格过滤,删除功能示例
Dec 23 Javascript
JavaScript异步加载问题总结
Feb 17 Javascript
bootstrap Table实现合并相同行
Jul 19 Javascript
Vue-CLI 项目在pycharm中配置方法
Aug 30 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开发环境配置(MySQL数据库安装图文教程)
2010/04/28 PHP
PHP 通过Socket收发十六进制数据的实现代码
2013/08/16 PHP
ThinkPHP写数组插入与获取最新插入数据ID实例
2014/11/03 PHP
PHP5.2下preg_replace函数的问题
2015/05/08 PHP
用显卡加速,轻松把笔记本打造成取暖器的办法!
2013/04/17 Javascript
jquery的flexigrid无法显示数据提示获取到数据
2013/07/19 Javascript
js实现当鼠标移到表格上时显示这一格全部内容的代码
2016/06/12 Javascript
Nodejs全局安装和本地安装的不同之处
2016/07/04 NodeJs
总结Node.js中的一些错误类型
2016/08/15 Javascript
jquery实现全选、不选、反选的两种方法
2016/09/06 Javascript
JS基于面向对象实现的选项卡效果示例
2016/12/20 Javascript
JavaScript使用readAsDataUrl方法预览图片
2017/05/10 Javascript
ReactNative踩坑之配置调试端口的解决方法
2017/07/28 Javascript
Js面试算法详解
2018/04/08 Javascript
vue.js 实现点击展开收起动画效果
2018/07/07 Javascript
解决vue接口数据赋值给data没有反应的问题
2018/08/27 Javascript
微信自定义分享链接信息(标题,图片和内容)实现过程详解
2019/09/04 Javascript
vue 中使用print.js导出pdf操作
2020/11/13 Javascript
javascript实现拼图游戏
2021/01/29 Javascript
简单了解python模块概念
2018/01/11 Python
pandas多级分组实现排序的方法
2018/04/20 Python
Python修改文件往指定行插入内容的实例
2019/01/30 Python
django admin后台添加导出excel功能示例代码
2019/05/15 Python
如何通过50行Python代码获取公众号全部文章
2019/07/12 Python
使用Python串口实时显示数据并绘图的例子
2019/12/26 Python
html5指南-2.如何操作document metadata
2013/01/07 HTML / CSS
英格兰足协官方商店:England Store
2019/07/12 全球购物
寻找迷宫的一条出路,o通路;X:障碍
2016/07/10 面试题
不拖欠农民工工资承诺书
2014/03/31 职场文书
股份转让协议书
2014/04/12 职场文书
2014年党委工作总结
2014/11/22 职场文书
2014年宣传部个人工作总结
2014/12/06 职场文书
劳动模范获奖感言
2015/07/31 职场文书
2016年小学中秋节活动总结
2016/04/05 职场文书
全新239军机修复记
2022/04/05 无线电
SQL Server携程核心系统无感迁移到MySQL实战
2022/06/01 SQL Server