Angular.js:当输入处于焦点时设置CSS [英] Angular.js: Set CSS when Input is on Focus
本文介绍了Angular.js:当输入处于焦点时设置CSS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
有人知道如何进行以下工作:
Does someone knows how to get the following working:
如果用户在名称"中单击-将CSS类设置为DIV上的XYZ吗?
If an user clicks inside "name" - Set CSS Class to XYZ on DIV ?
<div ng-class="???">Enter your Name here</div>
<input type="text" ng-model="user.name" required id="name"/>
版本:AngularJS v1.0.8
Version: AngularJS v1.0.8
推荐答案
如果您使用的是Angular 1.2.x,请参见 ng-blur
:
If you're using Angular 1.2.x, see ng-focus
and ng-blur
:
<div ng-class="{xyz: focused}">Enter your name here</div>
<input type="text" ng-model="user.name" ng-init="focused = false" ng-focus="focused = true" ng-blur="focused = false" id="name" required>
如果您使用的是1.0.x版本,则不会阻止您基于blur
指令/blob/b891c708cf1a19dc0744649547d6499f9d217e01/src/ng/directive/ngEventDirs.js#L38"rel =" noreferrer>角度为1.2.x的:
If you're using a 1.0.x version, nothing is stopping you from defining your own focus
and blur
directives based on Angular 1.2.x's:
/*
* A directive that allows creation of custom onclick handlers that are defined as angular
* expressions and are compiled and executed within the current scope.
*
* Events that are handled via these handler are always configured not to propagate further.
*/
var ngEventDirectives = {};
forEach(
'click dblclick mousedown mouseup mouseover mouseout mousemove mouseenter mouseleave keydown keyup keypress submit focus blur copy cut paste'.split(' '),
function(name) {
var directiveName = directiveNormalize('ng-' + name);
ngEventDirectives[directiveName] = ['$parse', function($parse) {
return function(scope, element, attr) {
var fn = $parse(attr[directiveName]);
element.on(lowercase(name), function(event) {
scope.$apply(function() {
fn(scope, {$event:event});
});
});
};
}];
}
);
这篇关于Angular.js:当输入处于焦点时设置CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文