angular 调用element的 onfocus onkeydown onblur等事件
项目里要实现一个input验证通过就切换到下一个input的功能
当然用jq dom操作很简单 ,大家都懂,现在用 angular,mvc 数据模型控制分离,不想再dom操作怎么办
以下方法
<textarea style="height: 73px;min-height: 73px;resize: none "
type="text"
focus-me="item.Bake.FocusNext"
maxlength="500"
ng-model="item.Bake.PromoText" />
app.directive('focusDir',[ "$timeout","$parse" ,function($timeout,$parse) {
return {
link: function($scope, element, attrs) {
var model = $parse(attrs.focusDir);
$scope.$watch(model, function(value) {
// console.log('value=',value);
if(value === true) {
$timeout(function() {
element[0].focus();
});
}
});
// to address @blesh's comment, set attribute value to 'false'
// on blur event:
element.bind('blur', function() {
// console.log('blur');
$scope.$apply(model.assign($scope, false));
});
}
};
}] );
//Tip:记得 引入"$timeout","$parse"
这个事focus ,类似的 大家可以用于kedown keyup等等
引用:http://stackoverflow.com/questions/14833326/how-to-set-focus-on-input-field
angular 调用element的 onfocus onkeydown onblur等事件的更多相关文章
- [转载]浏览器事件window.onload、onfocus、onblur、ons
原文地址:浏览器事件window.onload.onfocus.onblur.onscroll和resize作者:lilyxiao <html> <head> <titl ...
- 真正让HTML标签、DIV、SPAN拥有onfocus和onblur,聚焦和失焦
转载:http://blog.sina.com.cn/s/blog_7dfe67db01010lnq.html 默认火狐或者其他浏览器里DIV和其他普通标签是不具有onfocus和onblur事件的, ...
- 搜索框请输入关键字 onfocus 和 onblur
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 事件类型(onfocus和onblur)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 使用onfocus与onblur实现搜索框附加信息
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Angular 调用百度地图API接口
Angular 调用百度地图API接口 参考原文:https://blog.csdn.net/yuyinghua0302/article/details/80624274 下面简单介绍一下如何在Ang ...
- Angular如何给动态生成的元素绑定事件
在AngularJS中,操作DOM一般在指令中完成,事件监听机制是在对于已经静态生成的dom绑定事件,而如果在指令中动态生成了DOM节点,动态生成的节点不会被JS事件监听. 举例来说: angular ...
- ReactiveX 学习笔记(18)使用 RxJS + Angular 调用 REST API
JSON : Placeholder JSON : Placeholder (https://jsonplaceholder.typicode.com/) 是一个用于测试的 REST API 网站. ...
- js焦点事件:onfocus、onblur、focus()、blur()、select()
焦点:使浏览器能够区分用户输入的对象,当一个元素有焦点的时候,那么他就可以接收用户的输入只有能够响应用户操作额元素才可以接收焦点事件,比如:a button input... onfocus:当元素获 ...
随机推荐
- idea 搜索不到前端的ajax controller接口的原因
这是因为我把 web 目录设置成了 Excluded ,没有索引所以找不到了 参考: https://www.cnblogs.com/kinome/p/9991022.html IDEA 出现 upd ...
- Laravel 跨框架队列交互
公司大部分项目是laravel框架,但有些是yii框架,这两个框架之间有消息需要通信,比如在yii框架发布消息,laravel框架中的队列去处理,用redis作为消息连接纽带 laravel 队列原理 ...
- BootStap学习笔记(1)
移动设备优先: 为了让开发的网站对移动设备友好,确保适当的绘制和触屏缩放,需要在网页的head之中添加viewport meat标签:如下: <metaname="viewport& ...
- Jenkins部署资料
http://www.cnblogs.com/gaohongchen01/p/5058928.html https://www.javacodegeeks.com/2015/04/jenkins-ho ...
- jenkins 自动上传代码到nexus 私库
1.jenkins 项目配置上传 2.jenkins 访问私库下载配置 -X clean install 3.maven 配置文件 /usr/local/maven/conf/settings.xml ...
- QTP日常积累
1.init同步测试对象 同步测试对象: CODE: Browser("百度一下,你就知道").Page("百度一下,你就知道").WebEdit(" ...
- JAVA枚举操作(获取值,转map集合)
JAVA枚举相对来说比.NET的枚举功能强大,感觉就像是一种简化版的类对象,可以有构造方法,可以重载,可以继承接口等等,但不能继承类,JAVA枚举在实际开发中应用相当频繁,以下几个封装方法在实际开发中 ...
- spring cloud 入门系列:总结
从我第一次接触Spring Cloud到现在已经有3个多月了,当时是在博客园里面注册了账号,并且看到很多文章都在谈论微服务,因此我就去了解了下,最终决定开始学习Spring Cloud.我在一款阅读A ...
- 分析(function(window, undefined) {})(window)
有的时候,我们会在JS框架中看到这行 (function(window, undefined) {})(window) ,它是做什么用的,我们来分析下它 首先这就是一个匿名函数,立即执行它 (func ...
- mysql读写分离配置(整理)
mysql读写分离配置 环境:centos7.2 mysql5.7 场景描述: 数据库Master主服务器:192.168.206.100 数据库Slave从服务器:192.168.206.200 M ...