单击元素时隐藏 iframe

Question

我有一个隐藏的 Iframe，当函数加载完成时它会改变可见性。

我这样做是因为在加载函数中我对 iframe 样式做了一些更改，比如我隐藏了一些元素和背景颜色更改，这样用户就看不到旧样式，当它完成时我会更改iframe 可见。

现在我遇到了一个问题，当用户确实单击了转到另一个页面的元素时，旧样式会显示，直到 iframe 加载功能完成并再次更改样式。

我想在用户单击此元素时将 iframe 的可见性更改为隐藏，然后在加载函数上它将 iframe 再次更改为可见。

现在我正在这样做：

$(function(){
    var f=$('#foo')
    f.load(function(){ 
        var css = '<style type="text/css">#_____c, #navTabs {display: none;} body{background: white;}</style>';
        f.contents().find("head").append(css);

        document.getElementById("foo").style.visibility = 'visible';

        f.contents().find("#_bw0__r").on('click', function(event) { 
            document.getElementById("foo").style.visibility = 'hidden';
        })
    });
});

但是当用户与 iframe 的某些元素交互时，onClick 函数在下一个页面加载时不起作用。

Answer 1

    f.contents().find("#_bw0__r").on('click', function(event) { 
        document.getElementById("foo").style.visibility = 'hidden';
    })

放在外面f.load(函数)

单击元素时隐藏 iframe

Hidding iframe when element click

javascript

iframe

jquery

load

hide