Solo intento sumergirme en jquery y perdonarme si esto ya ha sido respondido. Busqué, pero no pude encontrar un ejemplo relevante a lo que estoy tratando de hacer.

Tengo un menú vertical con algunos submenús. Está funcionando que cuando se hace clic en el menú de nivel superior, se abre el submenú. El problema es que me gustaría que el submenú permanezca abierto cuando se hace clic en uno de los elementos del submenú. Tal como está ahora, cuando se hace clic en un elemento del submenú, el menú se colapsa.

Aquí está mi código:

// Add class of drop if item has sub-menu
$('ul.sub-menu').closest('li').addClass('drop');

// Left Sidebar Main Navigation
var menu_ul = $('.menu > li.drop > ul'),
    menu_a  = $('.menu > li.drop > a');

menu_ul.hide();

menu_a.click(function(e) {
    e.preventDefault();
    if(!$(this).hasClass('active')) {
        menu_a.removeClass('active');
        menu_ul.filter(':visible').slideUp('normal');
        $(this).addClass('active').next().stop(true,true).slideDown('normal');
    } else {
        $(this).removeClass('active');
        $(this).next().stop(true,true).slideUp('normal');
    }
});

Creo que si intento traducir lo que quiero en una oración clara de tipo codificador, se leería así. Básicamente, necesito consultar el DOM para cualquier menú activo que tenga un submenú, y si la página muestra uno de los elementos del submenú, entonces muestre el menú desplegable del submenú.