Question

我有一个文本框和几个按钮，我想当用户点击任何按钮然后文本框将有焦点。我试过这种方式，但没有工作angular.element("#txtData").focus();

我的完整代码

<div ng-app="myApp" ng-controller="myCtrl">
<table border=2>
<tr>
<td colspan=5><input type=text ng-model="Operantion" id="txtData" style="width:97%" ng-change="GetData(Operantion,'onChange')"></td>
</tr>
<tr>
<td><input type=button value="+" ng-click="GetData('+','btnClick')"></td>
<td><input type=button value="-" ng-click="GetData('-','btnClick')"></td>
<td><input type=button value="x" ng-click="GetData('*','btnClick')"></td>
<td><input type=button value="/" ng-click="GetData('/','btnClick')"></td>
<td><input type=button value="=" ng-click="GetData('=','btnClick')"></td>
</tr>
</table>
</div>

var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope) {
    $scope.GetData = function (arg1, evtType) {
        if (evtType === 'btnClick') {
            angular.element("#txtData").focus();
        }
    };
});

js fiddle https://jsfiddle.net/tridip/wzvq5ov8/

我在这个论坛中发现了几个相同类型的帖子，并且看到人们编写了许多代码来通过自定义指令来实现这一点。我很新，这就是为什么我不理解他们的代码。一个类似的帖子网址，我查了https://stackoverflow.com/a/15529412/728750

此代码angular.element("#txtData").focus();假设在角度工作但没有.......我需要引用任何名为 jqLite 的库吗？

我听说jqLite是内置角js ......是真的吗？谁能告诉我为什么这段代码不能从控制器函数中运行angular.element("#txtData").focus();？

Answer 1

我找到了如何使用angular指令放置焦点。这是代码

jsfiddle https://jsfiddle.net/tridip/muz887hu/1/

# get cumulative sum by ID for each year
test[, "sumMonthYear" := cumsum(Value), by=c("ID", "year")]
# get cumulative sum by ID
test[, "sumYear" := cumsum(Value), by=c("ID")]

Answer 2

首先，您在JS控制台中有一个雄辩的错误，可以以正确的方式引导您：

VM363 angular.js：12520错误：[jqLite：nosel]通过查找元素 jqLite不支持选择器！看到： http://docs.angularjs.org/api/angular.element http://errors.angularjs.org/1.4.8/jqLite/nosel

所以，不要使用jqLite或jQuery，并在元素本身上使用.focus()，尽可能简单：

document.querySelector("#txtData").focus();

    var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope) {
      $scope.GetData = function(arg1, evtType) {
        if (evtType === 'btnClick') {
          document.querySelector("#txtData").focus();
        }
      };
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <table border=2>
    <tr>
      <td colspan=5>
        <input type=text ng-model="Operantion" id="txtData" style="width:97%" ng-change="GetData(Operantion,'onChange')">
      </td>
    </tr>
    <tr>
      <td>
        <input type=button value="+" ng-click="GetData('+','btnClick')">
      </td>
      <td>
        <input type=button value="-" ng-click="GetData('-','btnClick')">
      </td>
      <td>
        <input type=button value="x" ng-click="GetData('*','btnClick')">
      </td>
      <td>
        <input type=button value="/" ng-click="GetData('/','btnClick')">
      </td>
      <td>
        <input type=button value="=" ng-click="GetData('=','btnClick')">
      </td>
    </tr>
  </table>
</div>

AngularJS当按钮单击

我的完整代码

2 个答案: