适应导航菜单，链接在移动设备上不起作用（儿童主题）

Question

我最近关注了一个帖子，描述了如何安装Child主题，该主题使我的移动导航菜单能够像永久扩展之前一样折叠起来。安装和配置后，我意识到父链接在移动设备上不可单击，只有箭头可展开菜单。我曾尝试在导航编辑器中从父母那里删除网址，但这似乎不起作用。有什么办法可以使整个周围的框触发下拉菜单？

理想情况下，如果您知道我的意思，我想从父页面中删除链接，以便它们仅充当通向子页面的导航的一部分。

    ( function( $ ) {

    $( document ).ready( function() {

        /* Original Menu JavaScript */

        var $masthead = $( '#masthead' ),
        timeout = false;

        $.fn.smallMenu = function() {
            $masthead.find( '.site-navigation' ).removeClass( 'main-navigation' ).addClass( 'main-small-navigation' );
            $masthead.find( '.site-navigation h1' ).removeClass( 'assistive-text' ).addClass( 'menu-toggle' );

            $( '.menu-toggle' ).unbind( 'click' ).click( function() {
                $masthead.find( '.menu' ).toggle();
                $( this ).toggleClass( 'toggled-on' );
            } );
        };

        // Check viewport width on first load.
        if ( $( window ).width() < 769 )
            $.fn.smallMenu();

        // Check viewport width when user resizes the browser window.
        $( window ).resize( function() {
            var browserWidth = $( window ).width();

            if ( false !== timeout )
                clearTimeout( timeout );

            timeout = setTimeout( function() {
                if ( browserWidth < 769 ) {
                    $.fn.smallMenu();
                } else {
                    $masthead.find( '.site-navigation' ).removeClass( 'main-small-navigation' ).addClass( 'main-navigation' );
                    $masthead.find( '.site-navigation h1' ).removeClass( 'menu-toggle' ).addClass( 'assistive-text' );
                    $masthead.find( '.menu' ).removeAttr( 'style' );
                }
            }, 200 );
        } );

        var container = $( '.site-navigation' );

        // Fix child menus for touch devices.
        function fixMenuTouchTaps( container ) {
            var touchStartFn,
                parentLink = container.find( '.menu-item-has-children > a, .page_item_has_children > a' );

            if ( 'ontouchstart' in window ) {
                touchStartFn = function( e ) {
                    var menuItem = this.parentNode;

                    if ( ! menuItem.classList.contains( 'focus' ) ) {
                        e.preventDefault();
                        for( var i = 0; i < menuItem.parentNode.children.length; ++i ) {
                            if ( menuItem === menuItem.parentNode.children[i] ) {
                                continue;
                            }
                            menuItem.parentNode.children[i].classList.remove( 'focus' );
                        }
                        menuItem.classList.add( 'focus' );
                    } else {
                        menuItem.classList.remove( 'focus' );
                    }
                };

                for ( var i = 0; i < parentLink.length; ++i ) {
                    parentLink[i].addEventListener( 'touchstart', touchStartFn, false )
                }
            }
        }

        fixMenuTouchTaps( container );


        /* New JavaScript added to toggle submenus on mobile */

        var container = $( '.main-small-navigation:first' );

        function initMainNavigation( container ) {

            // Add dropdown toggle that displays child menu items.
            var dropdownToggle = $( '<button />', { 'class': 'dropdown-toggle', 'aria-expanded': false }).append( $( '<span />', { 'class': 'screen-reader-text', text: confitChildScreenReaderText.expand }) );

            $( container ).find( '.menu-item-has-children > a, .page_item_has_children > a' ).after( dropdownToggle );

            // Set the active submenu dropdown toggle button initial state.
            $( container ).find( '.current-menu-ancestor > button' )
                .addClass( 'toggled-on' )
                .attr( 'aria-expanded', 'true' )
                .find( '.screen-reader-text' )
                .text( confitChildScreenReaderText.collapse );

            // Set the active submenu initial state.
            $( container ).find( '.current-menu-ancestor > .sub-menu, .current-menu-ancestor > .children' ).addClass( 'toggled-on' );

            $( container ).find( '.dropdown-toggle' ).click( function( e ) {
                var _this = $( this ),
                screenReaderSpan = _this.find( '.screen-reader-text' );

                e.preventDefault();
                _this.toggleClass( 'toggled-on' );
                _this.next( '.children, .sub-menu' ).toggleClass( 'toggled-on' );

                _this.attr( 'aria-expanded', _this.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );

                screenReaderSpan.text( screenReaderSpan.text() === confitChildScreenReaderText.expand ? confitChildScreenReaderText.collapse : confitChildScreenReaderText.expand );
            });
        }
        initMainNavigation( container );

    } );
} )( jQuery );

和CSS：

.dropdown-toggle {
    display: none;
}

.main-small-navigation .children,
.main-small-navigation .sub-menu {
    display: none;
}

.main-small-navigation .children.toggled-on,
.main-small-navigation .sub-menu.toggled-on {
    display: block;
}

.main-small-navigation li {
    border-bottom: 1px solid #ccc;
    position: relative;
}

.main-small-navigation li li:last-of-type {
    border: 0;
}

.main-small-navigation .dropdown-toggle {
    background: transparent;
    box-shadow: none;
    display: block;
    right: 0;
    padding: 0 10px;
    position: absolute;
    top: 14px;
}

.main-small-navigation .dropdown-toggle:focus {
    outline: none;
}

.main-small-navigation .dropdown-toggle:before {
    content: "\f502";
    vertical-align: top;
    text-align: center;
    -moz-transition: color .1s ease-in 0;
    -webkit-transition: color .1s ease-in 0;
    display: inline-block;
    font-family: "Genericons";
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    line-height: 1;
    text-decoration: inherit;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    speak: none;
}

.main-small-navigation .dropdown-toggle.toggled-on {
    top: 5px;
}

.main-small-navigation .dropdown-toggle.toggled-on:before {
    content: "\f500";
}