使用javascript的图像可见性

Question

我想使用切换图像if-else但它不起作用，有人可以解释代码有什么问题吗？

<img src="img/somepic.jpg" id="pic"><br/>

<a href="javascript:toggleImg()">Toggle Image</a>

<script>

function toggleImg(){
    var img = document.getElementById('pic');

    var checkForVisible = img.style.visibility == "visible";

    if(checkForVisible == "visible"){
        img.style.visibility = "hidden";
    }
    else{
        img.style.visibility = "visible";
    }

}

</script>

我尝试使用“三元运算符”

img.style.visibility = checkForVisible ? "hidden" : "visible";

它奏效了。我只想知道不起作用的“if-else”代码。谢谢

Answer 1

你做这个：

var checkForVisible = img.style.visibility == "visible";

== "visible" 使它成为 equals 表达式的结果，因此它将是真或假。

你的 if/else 是 checkForVisible == "visible" 这将不起作用，因为它只会是真或假。您只需要比较一次。

if(img.style.visibility == "visible"){
        img.style.visibility = "hidden";
    }
    else{
        img.style.visibility = "visible";
    }