angularJs之如何获取input的焦点（自定义指令）

最新推荐文章于 2021-10-27 16:31:33 发布

狼牙冷

最新推荐文章于 2021-10-27 16:31:33 发布

阅读量257

点赞数

分类专栏： angularJs 文章标签： angularJs focus input blur

本文链接：https://blog.csdn.net/jimolangyaleng/article/details/84830977

版权

angularJs 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

代码可直接运行：

<!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>

    <div ng-app="myApp" ng-controller="control">
        <input type="text" set-Focus ng-blur="setBlur()">
        <button ng-click="getFocus()">点击获取焦点</button>
    </div>  

<script type="text/javascript">     
    //模型
    var app = angular.module('myApp',[]);

    //控制器
    app.controller("control",function($scope){
        $scope.isCome = false;     
        $scope.isFocus = false;      

        $scope.getFocus = function(){
            $scope.isFocus = true; 
            $scope.isCome = true; 
        };

        $scope.setBlur = function(){
            $scope.isFocus = false;
alert('失去焦点')
        }
    });

    //自定义指令
     app.directive('setFocus',[ function(){
         return {
             scope:false,
             link:function(scope, element){                     
                 scope.$watch("isFocus",function(newValue,oldValue, scope) {
                    
                     if(newValue && scope.isCome){
                         element[0].focus(); //获取焦点
                         alert("获取到焦点了")
                     }
                }, true);;
             }
         };
    }]);

</script>
</body> 
</html>

狼牙冷

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
angularJs之如何获取input的焦点（自定义指令）

代码可直接运行：&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;meta charset="utf-8"&gt;&lt;script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"&gt;&lt;/script&gt;
复制链接

扫一扫

专栏目录