图片不会显示onLoad功能

我正在一个网站上工作，进入它的人，必须在加载时提示图像。这个图像就像任何图像，但显然它不会显示。我有一个onLoad函数和一个onClick函数，这样一旦图像显示出来，用户可以点击图像，然后在理论上它应该消失。我有一个变量，从一开始就是“假”，然后一旦加载页面，它应该变成“真”，然后一旦图像被点击，它应该再次变成“假”。通过这种方式，应该很容易控制图像是否显示。图片不会显示onLoad功能

我不完全确定什么是错的，因为一切看起来都是对的。

这是我的代码。

var popUP = false; 
 

 
function popUpOpen() { 
 
    var popUp = true; 
 
} 
 

 
function popUpClose() { 
 
    var popUp = false; 
 
} 
 

 
if (popUp = true) { 
 
    document.getElementById('popUpStart').style.visibility = 'visible'; 
 
} else { 
 
    document.getElementById('popUpStart').style.visibility = 'hidden'; 
 
}

#popUpStart { 
 
    position: absolute; 
 
    left: 50%; 
 
    top: 50%; 
 
    margin-left: -325px; 
 
    margin-top: -220px; 
 
    z-index: 3; 
 
}

<body onload="popUpOpen()"> 
 

 
    <img id="popUpStart" src="popUpOnLoad.png" style="visibility:hidden" onclick="popUpClose()" /> 
 

 
</body>

来源

2016-08-01 DevLiv

更改'var popUp = true;'为'popUp = true;'也''style.visibility'函数应该在onload后调用 –

@FastSnail，我很欣赏快速的答案，你的意思是在开始的变量语句或在函数声明之后？ – DevLiv

您将重新声明在外部范围内的变量。删除if中的var。做重新分配，而不是重新声明。 ==用于比较.. – Li357

你真正的问题是，检查是否弹出是真的还是假的代码刚好运行一次，甚至的onLoad发生之前。您可以更改popUp的值，但这不会改变图像的可见性。

你想要的东西，如：

var popUp = false; 

function updateImage() 
{ 
    if (popUp === true) { 
     document.getElementById('popUpStart').style.visibility='visible'; 
    } else { 
     document.getElementById('popUpStart').style.visibility='hidden'; 
    } 
} 

function popUpOpen(){ 
    popUp = true; 
    updateImage(); 
} 

function popUpClose() { 
    popUp = false; 
    updateImage() 
}

注意，变更此功能删除“无功”，并使用“===”，而不是在您的比较“=”。

来源

2016-08-01 02:11:31

非常感谢你！它现在像一种魅力。 – DevLiv

图片不会显示onLoad功能

回答

相关问题