Question

求高手优化jquery代码

如题，自己写的jquery代码算是勉强能实现功能吧，但是也看越别扭，求高手给评价评价最好写清楚思路，如何实现我当前的代码功能！就15分了 全给
http://ajnzcuyjb3.l14.yunpan.cn/lk/QXh4gMGRZVrBk 忘记把文件地址贴出来了...

Answer 1

看你的代码，估计是想做一个二级菜单的效果，在滑动到子菜单的时候仍然保持当前的主导航链接高亮，其实比较简单。

$('.nav ul li').each(function(){
    var _this = $(this);
    var baseLink = _this.find('a:first');
    var subMenu = _this.find('ul:first');
    _this.hover(function(){
        baseLink.addClass('nav_list_on');
        subMenu.show();
    },function(){
        baseLink.removeClass('nav_list_on');
        subMenu.hide();
    });
})

遍历当前的列表，直接添加hover连续事件就可以，当前栏目下有子菜单才会显示子菜单，没有就不显示即可。

追问

代码很清晰，但是不是我要的效果，鼠标一开主菜单项之后，该项的样式就没有了，而不是一直保持选中的样式

追答

如果你想一直保持，也很简单的，代码和作文一样，就是逻辑问题。

其实，代码更简单！

$('.nav ul li').each(function(){
    var _this = $(this);
    var baseLink = _this.find('a:first');
    var subMenu = _this.find('ul:first');
    var vSubMenu = _this.siblings().find('ul:visible');
    
    //鼠标滑入时执行，没有滑出的执行，则就等于保持当前状态
    _this.mouseover(function(){
        //首先移除其他有状态的项目
        _this.siblings().find('a').removeClass('nav_list_on');
        
        //隐藏其他正在显示的菜单
        vSubMenu.hide();
        
        //当前项目添加状态
        baseLink.addClass('nav_list_on');
        
        //显示当前菜单
        subMenu.show();
    });
})

追问

还是不行啊  你太不严谨了吧 测试都不测试就给我贴来了

Answer 2

坑爹的网盘
<script>
$(document).ready(function(){
$('.nav ul li a').mousemove(function(){
if($(this).attr('id')!='first'){
$(this).addClass('nav_list_on').parent().siblings().find('a').removeClass('nav_list_on').removeClass('nav_list_on_f');

}else{
$(this).addClass('nav_list_on_f').parent().siblings().find('a').removeClass('nav_list_on').removeClass('nav_list_on_f');
}
})

$('.nav>ul>li').mousemove(function(){
$(this).find('ul').show().parent().siblings().find('ul').hide()
})
})
</script>

$('.nav ul li a')单独就赋值ID,不是单独就用class这样比较方便
$(this).addClass('nav_list_on').parent().siblings().find('a').removeClass('nav_list_on').removeClass('nav_list_on_f');
请不要这么长好不好 直接用id 即可

追问

刚接触勿怪，你的代码有错误我没详细排查，还有我的网盘也很给力！

追答

代码有没有错误没关系 主要是如何让代码更简单明了，不然以后想要修改就一头雾水了。
最简单，用id,class来定义，直接调用。

Answer 3

借用楼上djyuning520兄弟的代码，在后面补一句：

$('.nav ul li').each(function(){
    var _this = $(this);
    var baseLink = _this.find('a:first');
    var subMenu = _this.find('ul:first');
    _this.hover(function(){
        baseLink.addClass('nav_list_on');
        subMenu.show();
    },function(){
        baseLink.removeClass('nav_list_on');
        subMenu.hide();
    });
    /* 补充 */ 
    subMenu.mouseenter(function(){
        baseLink.removeClass('nav_list_on');
    });
});

追问

好吧 你补充道也不能实现，我在自己研究研究吧