单击带有 javascript 和元素的 angularjs 按钮

Question

我正在开发一个浏览器扩展程序，它可以自动点击页面上的按钮。该代码适用于除 angularjs.

以外的所有站点

下面的代码是我尝试点击一个 angularjs 按钮并让它注册点击，但它不起作用。

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

这是未注册 "click"

的 applyButton 的 angular html 代码

<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 的输入字段的最佳做法？

Answer 1

您似乎需要将元素包装在 $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')
});

有了这个，您将不需要调用 e.scope().$apply(); - $timeout 将在必要时调用一个循环。此外，虽然您没有在示例中指定，但 .trigger() 需要 jQuery 并且没有融入 AngularJS 的 jqLite。

JSFiddle Link - 演示

单击带有 javascript 和元素的 angularjs 按钮

click angularjs button with javascript and element only

html

javascript

jquery

click

angularjs