可见性属性停止在 Chrome 中为我工作答案

【问题标题】：Visibility attribute stopped working in chrome for me可见性属性停止在 Chrome 中为我工作
【发布时间】：2012-09-27 20:15:49
【问题描述】：

几个月前我创建了一个网络应用程序，并在 ie、ff 和 chrome 中测试它运行良好。

我昨晚去添加一些东西，发现我的隐藏 iframe 功能不再在 chrome 中工作。

如果我检查元素，我可以看到属性确实在变化，但 iframe 并未隐藏。

function hideIFrame(){
    document.getElementById("myFrame").style.visibility="hidden";
    self.focus();
}

function showIFrame(){
    document.getElementById("myFrame").style.visibility="visible";
}

myFrame div 一开始是隐藏的。并且成功可见，但是当可见性更改为隐藏 chrome 时并没有隐藏它，ff 和 ie 仍然隐藏它。

知道为什么吗？

修复：

function hideIFrame(){
    document.getElementById("myFrame").style.visibility="hidden";
    document.getElementById("myFrame").style.opacity=0;
    self.focus();
}

function showIFrame(){
    document.getElementById("myFrame").style.visibility="visible";
    document.getElementById("myFrame").style.opacity=1;
}

【问题讨论】：

能否提供一个 jsfiddle。肯定有其他事情发生……
有同样的问题。你能找到关于 Chromium 的错误条目吗？编辑：找到这个条目：code.google.com/p/chromium/issues/detail?id=301376你能确认这个错误只发生在嵌入 Flash 内容的页面上吗？
@Gyum Fox 我的页面确实嵌入了 Flash 是的

标签： javascript html css iframe

【解决方案1】：

改用 display.none

    function hideIFrame(){ 
document.getElementById("myFrame").style.display="none";
    self.focus();
}

function showIFrame(){
    document.getElementById("myFrame").style.display="inline";
   //or document.getElementById("myFrame").style.display="block";
}`

【讨论】：

【解决方案2】：

在我的情况下，我将只使用 JS onload 来隐藏元素，我将能够使用 JS 来切换visibility="visible"

window.onload = function() {
  document.getElementById("newDiv").style.visibility = "hidden";
}
function showHidden() {
  document.getElementById("newDiv").style.visibility = "visible";
}

【讨论】：

【解决方案3】：

我没有明白你的问题。可能您应该在调用该函数的地方发布更多代码。这是一个在 chrome 中运行良好的示例代码。

<script type="text/javascript">
function hideIFrame(){
document.getElementById("myFrame").style.visibility="hidden";
self.focus();
}

function showIFrame(){
document.getElementById("myFrame").style.visibility="visible";
}
</script>

<input type="button" onclick="hideIFrame()" value="hide"/>
<input type="button" onclick="showIFrame()" value="show"/>

<iframe id="myFrame">

</iframe>

【讨论】：

是的，你的权利，我添加到一个小提琴，这适用于 chrome jsfiddle.net/SKFeC 但由于某种原因不在我的应用程序中

【解决方案4】：

iframe 可见性切换存在问题 ($('iframe').css('visibility','hidden') not working in google chrome)。如果您希望它消失，请使用高度，宽度：0。如果您希望它只是不可见，请使用 opacity:0。

【讨论】：