如何在悬停函数之外增加jquery :eq()参数？

Question

$('.arrow').eq(0).hover(function () {
    $('.sub-menu').eq(0).css('visibility', 'visible');
    $('.arrow').eq(1).hover(function () {
        $('.sub-menu').eq(1).css('visibility', 'visible');
        $('.arrow').eq(2).hover(function () {
            $('.sub-menu').eq(2).css('visibility', 'visible');
            $('.arrow').eq(3).hover(function () {
                $('.sub-menu').eq(3).css('visibility', 'visible');
                $('.arrow').eq(4).hover(function () {
                    $('.sub-menu').eq(4).css('visibility', 'visible');
                    $('.arrow').eq(5).hover(function () {
                        $('.sub-menu').eq(5).css('visibility', 'visible');
                        $('.arrow').eq(6).hover(function () {
                            $('.sub-menu').eq(6).css('visibility', 'visible');
                            $('.arrow').eq(7).hover(function () {
                                $('.sub-menu').eq(7).css('visibility', 'visible');

                            });
                        });
                    });
                });
            });
        });
    });
});

如果parent被悬停，我可以有一个向子类添加类的函数吗？我想做一个到wp主题的导航。谢谢))

Answer 1

这就是你要找的东西吗？

$('.parent').hover(function() {
    $(this).children().addClass('className');
});

编辑:我不认为你想要这么普通的东西...抱歉，我不太清楚你到底想做什么。

Answer 2

我认为你需要这样的东西：

// Listen for hover of ANY .arrow
$('.arrow').hover(
    function(){
        // Hover enter
        // Target a .sub-menu with the same index and show it
        $('.sub-menu').eq($(this).index()).css('visibility', 'visible');
    },
    function(){
        // Hover exit
        // Target a .sub-menu with the same index and hide it
        $('.sub-menu').eq($(this).index()).css('visibility', 'hidden');
    }
);

需要说明的是：

是的，我知道这可以在一定程度上进行优化，但我认为这将帮助OP更好地理解jQuery的功能和多功能性。