Question

我正在撰写一些简单的代码，以便在点击按钮时更改图片的可见性，但我的document.getElementById().value即将显示为undefined。（我已尝试将.value替换为.display - 同样的结果）。

可能是什么问题？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <script>
        function hideImage(imageId){
            document.getElementById(imageId).visibility="hidden";
        }
        function showImage(imageId){
            document.getElementById(imageId).visibility="visible";
        }
        function switchVis(imageId){
            var curVis = document.getElementById(imageId).value;
            if(document.getElementById(imageId).value=="hidden"){
                document.getElementById("output").innerHTML="hidden";
                showImage(imageId);
            }
            else if(document.getElementById(imageId).value=="visible"){
                hideImage(imageId);
                document.getElementById("output").innerHTML="visible";
            }
            else{
                alert("Visibility Issue!\nVisibility value is " + curVis);
            }
        }
    </script>
</head>
<body>
    <img src="images/k3.gif" id="k3"><p>
    <button onclick=switchVis('k3')>Visibility</button>
    <div id="output"></div>
</body>

Answer 1

你可以获得这样的可见性：jsfiddle 所以它在document.getElementById('myId').style.visibility

//使可见光 document.getElementById('myId').style.visibility='visible'

//隐藏
document.getElementById('myId').style.visibility='hidden'

您使用的是innerHTML而不是值。值是输入元素。

Answer 2

试试这个

显示

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

隐藏

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

提及this以获得更好的想法

Answer 3

在img标记中添加可见性属性。能见度= “可见的”

2.还要检查能见度值。

的document.getElementById（图像标识）.style.visibility == “可见的”

在hideImage和showImage函数中使用相同的东西。

Answer 4

使用style不能简单地获得document.getElementById().value值。 getComputedStyle()给出元素的所有CSS属性的最终使用值。返回的样式是CSSStyleDeclaration对象，可用于获取样式的值。尝试下面的代码。它应该工作。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
 <script>
    function hideImage(imageId){
        document.getElementById(imageId).style.visibility="hidden";
    }
    function showImage(imageId){
        document.getElementById(imageId).style.visibility="visible";
    }
    function switchVis(imageId){
        var curVis = document.getElementById(imageId); //your element
        style = window.getComputedStyle(curVis); //returns CSSStyleDeclaration object
        curVis = style.getPropertyValue('visibility'); //now get your css value

        if(curVis=="hidden"){
            document.getElementById("output").innerHTML="visible";
            showImage(imageId);
        }
        else if(curVis=="visible"){
            hideImage(imageId);
            document.getElementById("output").innerHTML="hidden";
        }
        else{
            alert("Visibility Issue!\nVisibility value is " + curVis);
        }
    }
 </script>
</head>
<body>
    <img src="images/k3.gif" id="k3" value="check"><p>
    <button onclick="switchVis('k3')">Visibility</button>
    <div id="output"></div>
</body>

getElementById（）。value返回Undefined

4 个答案: