单击子菜单时，在父项上旋转div

Question

我正在构建一个wordpress子菜单，其中父项目附有一个指南针，当单击该项目时它会旋转。当它在父本身上使用时，它可以正常工作，但有些项目有子菜单。

所以我试图像这样解决它。

$('#menu-main-menu li.submenu li').click(function(event) {
    event.preventDefault()
    $('#menu-main-menu li a').addClass('disabled');
    $(this).closest('.menu-item-has-children a .compass').addClass('rotate-compass');

    link_href = this.href;

    setTimeout(function () {            
        $('body').fadeOut(1000, function() {
            window.location.href = link_href;
        }); 
    },500);

});

旋转部分是不正确的，我尝试将旋转添加到父列表项div。我和父母一起尝试过，但没有运气，所以我的第二个想法是使用最接近的功能来瞄准它，但再次没有运气。我在这做错了什么？

-edit -

我添加了html结构，因为我没有打印出来只是因为它是由wp生成的，这很棘手。

Answer 1

假设链接和.compass是.menu-item-has-children的子项。您需要执行以下操作：

$(this).closest('.menu-item-has-children').find('a .compass').addClass('rotate-compass');

基本上你需要找到祖先，然后深入查找它的后代作为一个单独的查询。