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

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

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

编辑:当按钮变成可见时,点击功能应该触发。


您可以尝试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>

你可以试试这个....

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

作为epascarello,我们可以使用计时器来检查按钮是否可见。 所以,你可以在你的代码中使用setInterval

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

这是jsFiddle链接

链接地址: http://www.djcxy.com/p/83391.html

上一篇: How to trigger a javascript event when a button becomes visible?

下一篇: Dynamic check if div is displayed or not , jquery css (display:none/block)