极客观点
项目管理
HarmonyOS
问题代码
入web开发不到一年。最近开始学习JQuery，今天在敲完一段代码之后发现了一个有点儿神奇的问题，关于JQuery中的事件绑定的。先贴上代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>bind</title>
<script src="../jquery-2.2.2.min.js" type="text/javascript"></script>
</head>
<body>
<div id="panel">
<h5 class="head" style="background-color:green">点击我</h5>
<h5 class="show" style="visibility:hidden;background:red">显示</h5>
</div>
<script type="text/javascript">
$(function() {
var $h=$(".show");
$("#panel h5.head").bind("mouseover",function(){
$h.show();
});
$("#panel h5.head").bind("mouseout",function(){
$h.hide();
});
});
</script>
</body>
</html>问题描述
这段代码看上去没有一点儿问题。但是自己在查看效果时发现，当鼠标移到第一个h5标签上去的时候，第二个h5标签根本不显示，再移走，也没有反应；但是当我把第二个标签的visibility设置为visible的时候，鼠标移到第一个h5标签上去再离开之后，第二个h5标签就会消失，然后再移上去又会出现。
没弄明白为什么。希望理解这个问题的猿们帮忙解释一下。谢谢！
visibility:hidden;改成display:none。jQuery的
show()和hidden()控制的是CSS的display而不是visibility。