当按钮变得可见时，如何触发javascript事件?

I am using some third party js and html library(I don't want to update this library). There is an "apply all" button in HTML and what I want to do is "click this button when it becomes visible."

我正在使用第三方js和html库(我不想更新这个库)。在HTML中有一个“应用所有”按钮，我想做的是“当这个按钮变得可见时单击它”。

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

EDIT: When the button becomes visible click function should trigger.

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

5 个解决方案

#1

You can try MutationObserver that will listen for changes in css of element and then you can run click event when change happens.

您可以尝试MutationObserver，它将侦听元素css中的更改，然后在发生更改时运行单击事件。

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');
})

<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>

#2

you can try this....

你可以试试这个....

if($('#Element_name').is(':visible'))
{
    // you code goes here
}

#3

As epascarello, we can use a timer to check whether the button is visible or not. So, you can use setInterval in your code.

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

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

Here is the jsFiddle link

这是jsFiddle链接。

#4

You can simply do:

你可以做的:

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

In controller:

控制器:

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

#5

try this:

试试这个:

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

it check every 1 second that button is visible or not and if visible trigger button click

它每一秒钟检查按钮是否可见，如果是可见的触发器按钮点击

#1