Js下拉列表问题
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
ul,li{
list-style: none;
padding: 0;
margin: 0;
}
ul{
display: none;
}
h3{
margin: 0;
background: cornflowerblue;
}
div{
text-indent: 20px;
width: 200px;
}
.active{
background: coral;
}
ul li:hover{
background-color: #FFF5DA;}
<!--ul:hover{display:block;}-->
</style>
</head>
<body>
<div>
<h3>分组1</h3>
<ul>
<li>分组11</li>
<li>分组12</li>
<li>分组13</li>
</ul>
</div>
<div>
<h3>分组2</h3>
<ul>
<li>分组21</li>
<li>分组22</li>
<li>分组23</li>
<li>分组24</li>
</ul>
</div>
<div>
<h3>分组3</h3>
<ul>
<li>分组31</li>
<li>分组32</li>
<li>分组33</li>
<li>分组34</li>
<li>分组35</li>
</ul>
</div>
<script>
var h3s = document.getElementsByTagName("h3");
for(var i = 0;i<h3s.length;i++)
{
h3s.onmouseover = function()
{
this.style.background = "coral";
}
h3s.onmouseout = function()
{
this.style.background = "cornflowerblue";
}
}
/*-----------------*/
var uls = document.getElementsByTagName("ul");
for(var j = 0;j<uls.length;j++)
{
uls.onmouseover = function()
{
this.style.display = "block";
}
uls.onmouseout = function()
{
this.style.display = "none";
}
}
</script>
</body>
</html>
不知道为什么，隐藏的列表始终没法显示出来！请大神帮忙解惑，万分感谢 发错地方了，对不起，如果有大哥能帮忙，再好不过了，谢谢🙏
页:
[1]