Question

如何在Angular指令

中应用此jquery

Jquery的

$(":input:not(input[type=button],input[type=submit],button):enabled:visible:first").focus();

我试过以下但没有运气

Angular Directive Link

.directive('autoFocus', ['$timeout', function ($timeout) {
  return {
    scope: {
      autoFocusInitial: "="
    },
    link: function (scope, element, attrs) {

      if (scope.autoFocusInitial == true) {

        $timeout(function () {
          element[0].querySelector("input:not(.ng-hide)").filter(":enabled:visible:first").focus();
        });
      }
    }

  };
}

Answer 1

您的主要问题是可见和已启用

var dom = $element[0].querySelector('input:not(.ng-hide):not(:disabled)');

不会选择任何已停用的元素，默认情况下querySelector只能获取第一个元素，您无法(with vanilla javascript by default)根据:visible伪选择。

展示可见性的演示：http://jsfiddle.net/Lvc0u55v/12386/

编辑：正如您的评论建议的那样，您在textarea之后也会选择，请参阅我更新的DEMO，但只需一个简单的链就足够了：

$element[0].querySelectorAll('input:not(:disabled), textarea:not(:disabled)');

注意：我删除了ng-hide，因为它现在检查它是否可见，并且看到ng-hide是不可见的，将它添加到请求中是没有意义的。

编辑2：

看到你想要将焦点绑定到动态生成器（例如ng-repeat），我会有条件地告诉自动对焦何时运行，当ng-repeat完成时IE，在大多数情况下，你应该能够在没有ng-init或属性条件的情况下运行它。

DEMO：http://jsfiddle.net/Lvc0u55v/12393/或http://jsfiddle.net/Lvc0u55v/12394/

如何在angular js指令中启用第一个输入焦点

1 个答案: