我有代码在每个菜单项悬停时显示带弹出子菜单的菜单。
jQuery的:
<script type="text/javascript">
$(document).ready(function() {
var hoverAttributes = {
speed: 10,
delay: 100
};
$("#nav-home").bind("hover", hoverAttributes, function(){
$("#subnav").children().hide();
$("#sub-home").show();
});
$("#nav-library").bind("hover", hoverAttributes, function(){
$("#subnav").children().hide();
$("#sub-library").show();
});
});
</script>
HTML:
<div id="nav">
<table align="right">
<tr>
<td id="menu">
<ul>
<li><a href="../home" id="nav-home">Home</a></li>
<li><a href="../library" id="nav-library">Library</a></li>
</ul>
</td>
</tr>
<tr>
<td id="subnav">
<ul id="sub-home">
<li><a href="../home/forum.jsp">Forums</a></li>
<li><a href="../home/news.jsp">News</a></li>
<li><a href="../home/about.jsp">About Us</a></li>
</ul>
<ul id="sub-library">
<li><a href="../library/resources.jsp">Resources</a></li>
<li><a href="../library/glossary.jsp">Glossary</a></li>
<li><a href="../library/references.jsp">References</a></li>
</ul>
</td>
</tr>
</table>
</div>
此代码使用jquery-1.6.1.min.js,但是当我升级到jquery-1.12.4.min.js时,弹出功能会中断。在页面加载时,第一个菜单项(Home)的子菜单已经扩展。将鼠标悬停在其上或其他菜单项上不会导致所显示的内容发生变化。
我发现jQuery 3.0中已弃用bind()
操作,但它应该仍适用于1.12.4,不应该吗?我无法找到任何已弃用的children()
,hide()
或show()
的记录。
对于上下文,我对jQuery和JavaScript知之甚少。出现这个问题是因为我必须修复别人的代码。
答案 0 :(得分:1)
您是否尝试过将.bind更改为$(".selector").on("mouseover", function () {..});