我试图有一个按钮来显示和隐藏我的图像

Question

<!DOCTYPE html>
<html>
<head>
<title>Face</title>
<meta charset="UTF-8">
<script type="text/javascript">
//<![CDATA[

function myFunction(id) {
       var e = document.getElementById(id);
       if(e.style.visibility == "visible")
         e.style.visibility = 'hidden';
       else
          e.style.visibility = 'visibile';
    }



</script>
</head>
<body>

<div style="position: relative; visibility: visible;">
<img src="http://vignette4.wikia.nocookie.net/mrmen/images/5/52/Small.gif/revision/latest?cb=20100731114437"
          alt="Pumpkins" id="Pum"/>
<button onclick="myFunction('Pum')">Face</button>
</div>






</body>
</html>

我想要一个 shows/hidden 我的图片的按钮。我不明白我做错了什么。我收到一条错误消息 "TypeError: Cannot read property 'visibility' of null"。如何修复我的错误并使我的程序运行？

Answer 1

您的问题是代码中的错字

function myFunction(id) {
       var e = document.getElementById(id);
       if(e.style.visibility == "visible")
         e.style.visibility = 'hidden';
       else
          e.style.visibility = 'visible'; // <-------- SHOULD BE 'visible', was 'visibile'
    }

这应该可以解决您的问题。

我试图有一个按钮来显示和隐藏我的图像

I trying to have a button that shows and hidden my image

javascript

image

show-hide