图像不会在隐藏和显示之间切换 [英] Image will not switch between hidden and show
本文介绍了图像不会在隐藏和显示之间切换的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我无法获取图像在'隐藏'和'显示'之间来回切换
我正在使用来自$的创意b $ b 如何创建隐藏的< img>在JavaScript？
I'm using ideas from How to create a hidden <img> in JavaScript?
我有两个不同的按钮，使用html尝试一个，另一个使用javascript - 如果我注释掉一行，灯泡照片显示
I have two different buttons, trying one using html and the other to use javascript - If I comment out one line, the light bulb photo is displayed
//document.getElementById("light").style.visibility = "hidden";
这行代码在我的'init'函数中
如果我不对该线进行评论，那么无论我点击哪个按钮，灯都会保持隐藏状态
If I do not comment the line, the light stays 'hidden', no matter which of the buttons I click
我在Safari控制台中看不到任何错误登录Safari
I don't see any errors in the Web Console Log in Safari
<!DOCTYPE html>
<html>
<body>
<h1>Switch on the Light</h1>
<img id="light" src="WebVuCoolOldBulb-2.jpg" style="width:100px" >
<button type = button
onclick="document.getElementById('light').src.show ='WebVuCoolOldBulb-2.jpg'" >Switch On the Light
</button>
<input type="button" id="onButton" value="ON" />
</body>
<script>
//document.images['light'].style.visibility = hidden;
function init() {
//document.getElementById("light").style.visibility = "hidden";
var onButton = document.getElementById("onButton");
onButton.onclick = function() {
demoVisibility() ;
}
}
function demoVisibility() {
document.getElementById("light").style.visibility = "show";
}
document.addEventListener('readystatechange', function() {
// Seems like a GOOD PRACTICE - keeps me from getting type error I was getting
// https://stackoverflow.com/questions/14207922/javascript-error-null-is-not-an-object
if (document.readyState === "complete") {
init();
}
});
</script>
</html>
推荐答案
visibility style属性的值为 visible 和隐藏。
没有 show value。
function init() {
document.getElementById("light").style.visibility = "hidden";
var onButton = document.getElementById("onButton");
onButton.onclick = function() {
demoVisibility();
}
}
function demoVisibility() {
document.getElementById("light").style.visibility = "visible";
}
这篇关于图像不会在隐藏和显示之间切换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
