单击显示/隐藏图像

时间:2010-01-04 11:51:41

标签: javascript html

我需要在html页面中显示/隐藏图像。我觉得很简单。但是为什么我的错误“可见”未定义。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Ajax Test
    </title>
    <script type="text/javascript">
<!--
    function showImage(){
        document.getElementById('loadingImage').style.visibility=visible;
    }

    -->

    </script>
    </head>
<body>
    <input type="button" value="Ajax Button" onclick="showImage();"/>
    <img id="loadingImage" src="ajax-loader.gif" style="visibility:hidden"/>

</body>

6 个答案:

答案 0 :(得分:16)

你需要把它放在引号中 - 它是一个字符串:

document.getElementById('loadingImage').style.visibility='visible';

答案 1 :(得分:3)

我会使用Jquery。请在Jquery主页上下载。

然后,包括它:

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function showImage(){
$("#loadingImage").toggle();
}

</script>


<img id="loadingImage" src="ajax-loader.gif" style="display:none;"/>

答案 2 :(得分:3)

如果其他答案没有给出您所追求的结果,请尝试将显示设置为无:

document.getElementById('loadingImage').style.display='none';

答案 3 :(得分:0)

您需要将其括在引号中,否则JavaScript会认为您尝试将其设置为名为“visible”的变量的值。由于您没有名为“visible”的变量,因此您会收到错误消息,指出它未定义。

document.getElementById('loadingImage').style.visibility='visible';

答案 4 :(得分:0)

我非常抱歉。它应该是

  document.getElementById('loadingImage').style.visibility='visible';

可见周围缺少引号。

答案 5 :(得分:0)

这些都不适合我。您所要做的就是将图像类名设置为具有不透明度的css属性。

JavaScript:

document.getElementById('loadingImage').className = "opacityofimage";

CSS:

.opacityofimage {
    opacity:0;
}