时间戳

首页 > 解决方案 > 用javascript隐藏部分不起作用

javascript - 用javascript隐藏部分不起作用

问题描述

function showX()

document.getElementById("one").style.display = "block"; 
document.getElementById("two").style.display = "none"; 
document.getElementById("three").style.display = "none"; 

function showZ()

document.getElementById("one").style.display = "none"; 
document.getElementById("two").style.display = "block"; 
document.getElementById("three").style.display = "none"; 

function showY()

document.getElementById("one").style.display = "none"; 
document.getElementById("two").style.display = "none"; 
document.getElementById("three").style.display = "block"; 
div {display:inline;}
div img {width:400px;height: 400px;}

#one {
display: none;
}

#two {
display: none;
}

#three {
display: none;
}
<html>

<section id="one">
take this info es cool 1 
</section>

<section id="two">
take this info es cool 2 
</section>

<section id="three">
take this info es cool 3
</section>

</html>

当我单击我的图像时没有任何反应？任何人都可以帮我一把吗？

我一直在努力解决这个问题，所以决定来这里。提前感谢您的帮助！

我对编程很陌生，我正在创建的网站项目需要这个。

我需要它，所以当我访问网站时，它只会显示图片而不是部分。单击图片时，它将显示第一部分，但隐藏其他部分。

标签： javascripthtmlcss

解决方案

您缺少大括号{}。这是有效的。您还应该调用该函数。

function showX(){

document.getElementById("one").style.display = "block"; 
document.getElementById("two").style.display = "none"; 
document.getElementById("three").style.display = "none"; 

}

function showZ(){

document.getElementById("one").style.display = "none"; 
document.getElementById("two").style.display = "block"; 
document.getElementById("three").style.display = "none"; 

}

function showY(){

document.getElementById("one").style.display = "none"; 
document.getElementById("two").style.display = "none"; 
document.getElementById("three").style.display = "block";

}

showZ();
div {display:inline;}
div img {width:400px;height: 400px;}

#one {
display: none;
}

#two {
display: none;
}

#three {
display: none;
}
<html>

<section id="one">
take this info es cool 1 
</section>

<section id="two">
take this info es cool 2 
</section>

<section id="three">
take this info es cool 3
</section>

</html>

推荐阅读