<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="jquery-3.2.1.js" type="text/javascript"></script> <script src="二级菜单.js" type="text/javascript"></script> <link rel="stylesheet" href="blog%20css.css" type="text/css"/> <title>二级菜单</title> </head> <body> <div id="nav"> <ul> <li class="one"><a href="#">首 页</a> </li> <li class="one"><a href="#">新随笔</a> <ul> <li><a href="#">二级菜单二级菜单</a></li> <li><a href="#">二级菜单</a></li> <li><a href="#">二级菜单</a></li> </ul> </li> <li class="one"><a href="#">留 言</a> <ul> <li><a href="#">二级菜单二级菜单</a></li> <li><a href="#">二级菜单</a></li> <li><a href="#">二级菜单</a></li> </ul> </li> </ul> </div> </body> </html>
$(function () { $(".one").mouseover(function () { $(this).children("ul").show(); }) $(".one").mouseout(function () { $(this).children("ul").hide(); }) })
未解决show()和hide()增加时间参数导致闪烁的问题。