Question

我正在使用一些第三方js和html库（我不想更新这个库）。 HTML中有一个“全部应用”按钮，我想要做的是“当它变为可见时单击此按钮。”

<div class="confirm" ng-show="newFilters.length">
    ....
    <button class="btn btn-primary">Apply All</button>
</div>

编辑：当按钮变为可见时，应触发点击功能。

Answer 1

您可以尝试MutationObserver来监听元素css中的更改，然后在发生更改时运行click事件。

＆＃13;

setTimeout(function() {
  $('button').css('display', 'block');
}, 2000);

var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    if ($('button').css('display') !== 'none') {
      $('button').click();
    }
  });
});

observer.observe(document.querySelector('button'), {
  attributes: true,
  attributeFilter: ['style']
});

$('button').click(function() {
  alert('clicked');
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn btn-primary" style="display: none;">Apply All</button>

＆＃13;

Answer 2

你可以试试这个......

$(this).next()

Answer 3

作为epascarello，我们可以使用计时器来检查按钮是否可见。因此，您可以在代码中使用setInterval。

setInterval(function(){
  if($("#show").is(':visible')){
    console.log("run the code");
  }
},2000);

以下是jsFiddle链接

Answer 4

您可以这样做：

<div class="confirm" ng-show="newFilters.length">
    ....
    <button ng-click="newFilters.length && myFunction()" class="btn btn-primary">Apply All</button>
</div>

在控制器中：

$scope.myFunction(){
    console.log("hello");
}

Answer 5

试试这个：

setInterval(function(){
  if($("button.btn").is(':visible')){
    $(this).trigger('click');
    alert('button click');
  }
},1000);

它每隔1秒检查一次该按钮是否可见，如果可见触发按钮，则单击

如何在按钮变为可见时触发javascript事件？

5 个答案: