gpt4 book ai didi

javascript - 为什么我的用于隐藏/显示 div 框的 javascript 代码不起作用?

转载 作者:太空宇宙 更新时间:2023-11-04 12:27:24 25 4
gpt4 key购买 nike

我试图根据读者点击的菜单选项隐藏/显示我网站上的主要内容持有者。这对我来说似乎是一件简单的事情,我以前做过很多次,但现在它行不通了。我的代码如下所示:

<!DOCTYPE html>
<html>
<head>
<title id="titel">Mercedes F1</title>
<link rel="stylesheet" href="mercedes.css">
<meta name="viewport" content="width=device-width; initial-scale=1">
<script>
function sidbyte(p){
var p;
if(p == 1) {
document.getElementById("forare").style.display = "block";
document.getElementById("mercedes").style.display = "none";
document.getElementById("statistik").style.display = "none";
}
else if(p == 2) {
document.getElementById("forare").style.display = "none";
document.getElementById("mercedes").style.display = "block";
document.getElementById("statistik").style.display = "none";
}
else if(p == 3) {
document.getElementById("forare").style.display = "none";
document.getElementById("mercedes").style.display = "none";
document.getElementById("statistik").style.display = "block";
}
}
</script>
</head>
<body>
<div class="page">
<nav>
<a href="" onclick="sidbyte(1)">Förarbiografi</a>
<img src="Media/Menu_icon.svg" class="menuicon" alt="MenuIcon">
<a href="" onclick="sidbyte(2)">Mercedes F1</a>
<img src="Media/Menu_icon.svg" class="menuicon" alt="MenuIcon">
<a href="" onclick="sidbyte(3)">Statistik</a>
</nav>
<div id="forare" class="main">
<h1 class="rubrik">Förare</h1>
<p>

</p>
</div>
<div id="mercedes" class="main">
<h1 class="rubrik">Mercedes F1 genom åren</h1>
<p>

</p>
</div>
<div id="statistik" class="main">
<h1 class="rubrik">Statistik</h1>
<p>

</p>
</div>
</div>
</body>
</html>

最佳答案

主要问题是,每当您单击 a 标记时,页面都会重新加载。所以将 # 放在 a href 属性中强>标签。就是这样。

<a href="#">Click Here</a>

jsFiddle

注意: 在函数内部声明的局部 p 没有用,因为您正在使用参数.如果您只使用该参数,那么最好删除它,尽管它不会影响您的代码,除非您使用 this 关键字引用它。喜欢,

this.p // refers to the local p you declared.

关于javascript - 为什么我的用于隐藏/显示 div 框的 javascript 代码不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27919258/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com