【JQ】这种结构的下拉菜单鼠标移出时出现问题
<script>$(function(){vartimer=null;//隐藏事件functionhide(){varindex=$('#nav>div>a').inde...
<script>$(function(){ var timer = null;
//隐藏事件 function hide(){ var index = $('#nav>div>a').index(this); timer = setTimeout(function(){$('ul').eq(index).css('display','none');},500) } //显示事件 function show(){ var index = $('#nav>div>a').index(this); $('#header>ul').css('display','none'); $('ul').eq(index).css('display','block'); } //主导航的鼠标移入效果 $('#nav>div>a').mouseover(show); //主导航的鼠标移出效果 $('#nav>div>a').mouseout(hide); //子导航的鼠标移入效果 $('ul').mouseover(function(){ clearTimeout(timer); }); //子导航的鼠标移出效果 $('ul').mouseout(function(){ alert(1)});})</script></head><body> <div id="header"> <div id="nav"> <div><a href="javascript:">首页</a></div> <div><a href="javascript:">关于我们</a></div> <div><a href="javascript:">作品</a></div> <div><a href="javascript:">博客</a></div> <div class="last"><a href="#">>>更多</a></div> </div> <ul id="home"> <li><a href="#">最近更新</a></li> <li><a href="#">活动</a></li> <li><a href="#">报名试听</a></li> <li><a href="#">学员反馈</a></li> </ul>
<ul>
字符限制省略内容
</ul>
<ul>
字符限制省略内容
</ul>
<ul>
字符限制省略内容
</ul>
</div>
在写子导航的鼠标移出时，我想清除掉所有的二级UL的显示，发现出现了问题，用alert测试发现移入时也会弹出1，这是什么原因？
结构就不要说了，在只能用这种结构的情况下。解决问题必定追分谢谢。 展开
//隐藏事件 function hide(){ var index = $('#nav>div>a').index(this); timer = setTimeout(function(){$('ul').eq(index).css('display','none');},500) } //显示事件 function show(){ var index = $('#nav>div>a').index(this); $('#header>ul').css('display','none'); $('ul').eq(index).css('display','block'); } //主导航的鼠标移入效果 $('#nav>div>a').mouseover(show); //主导航的鼠标移出效果 $('#nav>div>a').mouseout(hide); //子导航的鼠标移入效果 $('ul').mouseover(function(){ clearTimeout(timer); }); //子导航的鼠标移出效果 $('ul').mouseout(function(){ alert(1)});})</script></head><body> <div id="header"> <div id="nav"> <div><a href="javascript:">首页</a></div> <div><a href="javascript:">关于我们</a></div> <div><a href="javascript:">作品</a></div> <div><a href="javascript:">博客</a></div> <div class="last"><a href="#">>>更多</a></div> </div> <ul id="home"> <li><a href="#">最近更新</a></li> <li><a href="#">活动</a></li> <li><a href="#">报名试听</a></li> <li><a href="#">学员反馈</a></li> </ul>
<ul>
字符限制省略内容
</ul>
<ul>
字符限制省略内容
</ul>
<ul>
字符限制省略内容
</ul>
</div>
在写子导航的鼠标移出时，我想清除掉所有的二级UL的显示，发现出现了问题，用alert测试发现移入时也会弹出1，这是什么原因？
结构就不要说了，在只能用这种结构的情况下。解决问题必定追分谢谢。 展开
1个回答
展开全部
换成mouseenter和mouseleave事件，自己可以查查这两个的区别
追问
恩～上午已经用这种方法解决了～非常感谢～！
追答
。。。
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
