WordPress集成JS/jQuery菜单：多级子菜单异常及链接失效求助

之前在Michael M.的帮助下，我已经修复了网站菜单的全部缺陷，但把菜单移植到WordPress站点后，出现了两个问题：

1. 所有菜单及子菜单仅能正常显示，但点击时无法打开链接。我已经删除了脚本中用来阻止菜单链接的代码sub_menu.stopPropagation();，但问题仍然没有解决。
2. 感谢Steve(76484)帮我完善了代码，这段代码在纯HTML模式下运行完全正常，但集成到WordPress后，又出现了新问题：只能正常添加一个子菜单，点击第二个子菜单时，所有子菜单都会关闭且无法再显示。

以下是我用到的相关代码：

WordPress菜单模板代码 #

<section>
    <nav id="nav">
        <span class="fas fa-bars icon_menu"></span>
        <aside class="main_menu">
            <?php
                if ( has_nav_menu( 'top_menu' ) ) {
                    wp_nav_menu( array(
                        'theme_location' => 'top_menu',
                        'menu_class' => 'menu',
                        'container' => false
                    ) );
                }
            ?>
        </aside>
    </nav>
</section>
<div class="back"></div>

主题functions.php中的菜单注册代码 #

if ( !function_exists( 'top_navigation_menus' ) ) {

    function top_navigation_menus() {

        $locations = array(
            'top_menu' => __( 'Site menu', 'text_domain' ),
        );
        register_nav_menus( $locations );

    }
    add_action( 'init', 'top_navigation_menus' );

}

样式方面没有做任何修改，仍然使用纯HTML模式下的原有样式。

内容的提问来源于stack exchange，提问作者Developer