by using document.activeElement in JavaScript, we can get element with focus. AngularJS is providing $document for window.document. Here I have written one example, Find below for it


Here I have given two input fields with names. Whenever user clicks on those input fields the focused element name will change. Here I have used both window.document and $document also
<!DOCTYPE html>
<html ng-app="" ng-controller="myCtrl">
<body ng-click="updateFocusElement()">
item 1 : <input name="item1"/><br/><br/>
item 2 : <input name="item2"/><br/><br/>
<b>Focused Item : (with document)</b> {{fucusedItemName}}<br/><br/>
<b>Focused Item : (with $document)</b> {{fucusedItemName1}}<br/><br/>
function myCtrl($scope, $document) {
    $scope.updateFocusElement = function() {
        $scope.fucusedItemName = angular.element(window.document.activeElement).attr('name');
        $scope.fucusedItemName1 = angular.element($document[0].activeElement).attr('name');

<script src="//"></script>



Follow this blog by Email

Popular Posts