gpt4 book ai didi

javascript隐藏div不起作用

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

我有两个 div,我只想根据单击列表元素显示其中一个 div。我写了下面的代码。它不工作。它总是向我显示 Div1(或我最初显示的任何一个)。如何让它显示合适的 div?谢谢。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script>
function showPane(paneId) {
document.getElementById("Div1").style.display="none";
document.getElementById("Div2").style.display="none";
document.getElementById(paneId).style.display="block";
}
</script>
</head>

<body onload="showPane('Div1');">
<ul id="nav">
<li><a href="" onclick="showPane('Div1')">Div1</a></li>
<li><a href="" onclick="showPane('Div2')">Div2</a></li>
</ul>

<div id="Div1">
<h3>This is Div1</h3>
</div>
<div id="Div2">
<h3>This is Div2</h3>
</div>
</body>
</html>

最佳答案

因为列表项是<a>将您重定向到同一页面。比正文加载显示 div1。

添加href="javascript:;"<a>以防止这种情况。


或添加 event函数的参数:

<a href="" onclick="showPane(event,'Div1')">

在函数中:

     function showPane(event,paneId) {
event.preventDefault();
//rest of code
}

防止 MouseClick 事件的默认行为。 http://codepen.io/yardenst/pen/cKqIy

关于javascript隐藏div不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18173621/

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