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>

我尝试使用＆＃34;三元运算符＆＃34;

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

它有效。我只想知道＆＃34; if-else＆＃34;代码不起作用。感谢

Answer 1

你这样做：

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

==＆＃34;可见＆＃34;使它成为等于表达式的结果，因此它将成为真或假。

你的if / else是checkForVisible ==＆＃34;可见＆＃34;因为只会是真或假而不会工作。你只需要比较一次。

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

Answer 2

使用toggle代替if else。

＆＃13;

function toggleImg() {
  var img = document.getElementById('pic');
  img.classList.toggle('hidden');

}

＆＃13;

.visible {
  display: block;
}
.hidden {
  display: none;
}

＆＃13;

<img src="img/somepic.jpg" id="pic">
<br/>

<a href="javascript:toggleImg()">Toggle Image</a>

＆＃13;

Answer 3

有错误。例如在checkForVisible var中。我不确定你要做什么，但是有太多的平等。你可以尝试一下：

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

    img.style.visibility = "visible";

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

}

使用javascript的图像可见性

3 个答案: