2016-09-01 4 views
1

kann nicht auf Textbox auf die Schaltfläche klicken konzentrieren:Angular Js Textbox Fokus nicht auf den Knopf klicken

<html ng-app="CommonApp"> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
</head> 
<body ng-controller="HeadCtrl" ng-init='username=""'> 
    <input id="UserName" type="text" class="login_boxdecor" ng-model="username" /> 
    <div class="login_btn_outer"> 
     <div class="login_btn_outer2" ng-click="cLgn();"> 
      <a class="btn">Login</a> 
     </div> 
    </div> 
</body> 
</html> 
var myApp = angular.module('CommonApp', []); 
    myApp.controller('HeadCtrl', function($scope){ 
     $scope.cLgn= function(){ 
      if($scope.username.trim().length==0) 
      { 
       //Here How to focus my textbox 
      } 
     }; 
    }); 

Antwort

1
<html ng-app="CommonApp"> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
</head> 
<body ng-controller="HeadCtrl" ng-init='username=""'> 
    <input id="UserName" type="text" class="login_boxdecor" ng-model="username" /> 
    <div class="login_btn_outer"> 
     <div class="login_btn_outer2" ng-click="cLgn();"> 
      <a class="btn">Login</a> 
     </div> 
    </div> 
</body> 
</html> 
var myApp = angular.module('CommonApp', []); 
    myApp.controller('HeadCtrl', function($scope){ 
     $scope.cLgn= function(){ 
      if($scope.username.trim().length==0) 
      { 
       document.getElementById("UserName").focus(); 
      } 
     }; 
    }); 
0

Sie angular.element können Ihre Eingabefeld auswählen und Fokus() aufrufen können. Versuchen Sie, etwas ähnlich wie unten ::

<html ng-app="CommonApp"> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
</head> 
<body ng-controller="HeadCtrl" ng-init='username=""'> 
    <input id="UserName" type="text" class="login_boxdecor" ng-model="username"/> 
    <div class="login_btn_outer"> 
     <div class="login_btn_outer2" ng-click="cLgn();"> 
      <a class="btn">Login</a> 
     </div> 
    </div> 
</body> 
</html> 
var myApp = angular.module('CommonApp', []); 
    myApp.controller('HeadCtrl', function($scope){ 
     $scope.focusText =false; 
     $scope.cLgn= function(){ 
      if($scope.username.trim().length==0) 
      { 
       angular.element("#UserName").focus(); 
      } 
     }; 
    }); 
+0

@Rahul: Seine nicht funktioniert –

+0

cLgn() aufgerufen zu werden ?? Können Sie das überprüfen? Siehe den laufenden Code @ http://jsfiddle.net/deathell/UTn5y/2/ – Ruhul

+0

Ich möchte meinen Textkasten auf Knopfdruck fokussieren und der Link, den du hier angegeben hast, ist ein Textfeld, wenn der Mauszeiger ein Textfeld fokussiert. –

Verwandte Themen