使用JavaScript和元素单击AngularJS按钮

Question

使用JavaScript和元素单击AngularJS按钮

4

我正在开发一个浏览器扩展程序，它可以自动点击页面上的按钮。这段代码在所有站点上都能正常工作，但在使用angularjs的网站上无法正常工作。

以下代码是我尝试点击angularjs按钮并使其注册点击的尝试，但它并没有起作用。

//applyButton is the button element.
if(angular) {
     var e = angular.element(applyButton);
     e.trigger('click');
     e.scope().$apply();
 } else {
     applyButton.click();
 }

这是 Angular 的 HTML 代码，用于应用按钮（applyButton），但无法响应 "click" 事件：

<input value="Apply" class="apply button gift-card-apply" data-ng-click="!orderSubmitErrors.giftCard.sectionHasErrors &amp;&amp; applyGiftCard($event)" client-validation="onSubmit,giftCard,validateSubsection" type="button">

如果我只能访问这些项目的document.element，是否有最佳实践可以从javascript中单击按钮和更改输入字段以用于angularjs？

- techdog

你的代码运行时元素是否存在？无法使用传统的页面加载处理方式。 - charlietfl

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- scniro · Accepted Answer

看起来你需要在$timeout中包装你的元素，以便在你的元素上调用.click。请观察以下简化示例...

<div ng-app="app" ng-controller="ctrl">
    <button id="btn" ng-click="click()">click</button>
</div>

var app = angular.module('app', []).controller('ctrl', function($scope, $timeout) {
    $scope.click = function() {
        console.log('click');
    }

    $timeout(function() {
        angular.element(document.getElementById('btn')).trigger('click')
    });

    //does not work
    angular.element(document.getElementById('btn')).trigger('click')
});

使用 $timeout，您将不需要调用 e.scope().$apply(); - 如果必要，$timeout 将调用一个循环。此外，尽管您在示例中没有指定，但值得注意的是，.trigger() 需要 jQuery，并且未包含在 AngularJS 的 jqLite 中。 JSFiddle链接 - 演示