JS：什么时候元素变得可见的事件监听器？

2018-06-04 11:44:37

我正在构建一个要包含在页面中的工具栏。它将被包括在内的div将默认显示：无 。有没有办法让我的工具栏上放置一个事件监听器来监听它是否可见，以便它可以初始化？或者我将不得不从包含页面传递一个变量？

谢谢

javascript事件处理用户交互，如果你的代码组织得不够，你应该能够在可见性改变的地方调用初始化函数（即你不应该在很多地方改变myElement.style.display，而是调用一个功能/方法，做这个和你可能想要的任何东西）

我有这个相同的问题，并创建了一个jQuery插件来解决它为我们的网站。

https://github.com/shaunbowe/jquery.visibilityChanged

下面是你将如何使用它的基础上你的例子：

$('#contentDiv').visibilityChanged(function(element, visible) {
    alert("do something");
});

至少有一种方法，但它不是一个很好的方法。您可以轮询元素以进行如下更改：

var previous_style,
    poll = window.setInterval(function()
{
    var current_style = document.getElementById('target').style.display;
    if (previous_style != current_style) {
        alert('style changed');
        window.clearInterval(poll);
    } else {
        previous_style = current_style;
    }
}, 100);

DOM标准还规定了突变事件，但我从来没有机会使用它们，我不确定它们得到了多大的支持。你会像这样使用它们：

target.addEventListener('DOMAttrModified', function()
{
    if (e.attrName == 'style') {
        alert('style changed');
    }
}, false);

这段代码不在我头顶，所以我不确定它是否可行。

最好和最简单的解决方案将是在显示目标的函数中进行回调。

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

上一篇: JS: event listener for when element becomes visible?

下一篇: The preferred way of creating a new element with jQuery