javascript - Divi Wordpress 主题：顶级父级不可点击且未链接到移动菜单上的页面，并折叠嵌套项目

问题描述

当媒体屏幕宽度小于 1025px 时，Divi 自动呈现移动菜单。默认情况下，所有菜单项（包括子菜单项）都以完整的展开视图显示，所有菜单项都在列表中。

问题是，父级菜单项不再可链接到其自己的网页。换句话说，点击具有嵌套子菜单的父菜单项只会展开或折叠子菜单，即使父菜单本身会导致有效的网页 URL，从本质上阻止访问者访问网页。

我已经尝试过我在网上找到的这个修复程序，但它不起作用。

#main-header .et_mobile_menu .menu-item-has-children > a:after { font-size: 16px; 内容：'4c'；顶部：13px；右：10px；} #main-header .et_mobile_menu .menu-item-has-children.visible > a:after { content: '4d'; } #main-header .et_mobile_menu ul.sub-menu { display: none !important; 可见性：隐藏！重要；transition: all 1.5s ease-in-out;} #main-header .et_mobile_menu .visible > ul.sub-menu { display: block !important; 可见性：可见！重要；}（函数（$）{

    function setup_collapsible_submenus() {
        var $menu = $('#mobile_menu'),
            top_level_link = '#mobile_menu .menu-item-has-children > a';

        $menu.find('a').each(function() {
            $(this).off('click');

            if ( $(this).is(top_level_link) ) {
                if ($(this).parent().hasClass('always-visitable')) {
                    $('<a class="hover-link"></div>')
                    .attr('href', $(this).attr('href'))
                    .on('click', function(e){ e.stopPropagation(); })
                    .appendTo($(this));
                }

                $(this).attr('href', '#');
            }

            if ( ! $(this).siblings('.sub-menu').length ) {
                $(this).on('click', function(event) {
                    $(this).parents('.mobile_nav').trigger('click');
                });
            } else {
                $(this).on('click', function(event) {
                    event.preventDefault();
                    $(this).parent().toggleClass('visible');
                });
            }
        });
    }

    $(window).load(function() {
        setTimeout(function() {
            setup_collapsible_submenus();
        }, 700);
    });

})(jQuery);
</script>

**Also the CSS:**

#main-header .et_mobile_menu .always-visitable {
    position: relative;
}
#main-header .et_mobile_menu .always-visitable .hover-link {
    position: absolute;
    top: 0; left: 0; bottom: 0;
    right: 60px; /* right area continues to expand or collapse */

标签： javascriptphpjquerywordpress

javascript - Divi Wordpress 主题：顶级父级不可点击且未链接到移动菜单上的页面，并折叠嵌套项目

问题描述

解决方案

推荐阅读