BootStrap3 manter o menu suspenso aberto depois de clicar no item

Estou usando bootstrap3.0, com excelente menu drop-down.

Se eu clicar fora do menu suspenso, o menu desaparecerá, e isso está correto.

mas quando clico no item do menu suspenso, ele também desaparece. isso não é certo, eu acho, e não há opções que podem controlar seu comportamento alternado. (Eu preciso do menu manter aberto quando eu clico nos itens, como o menu de notificação do facebook)

então eu acho que tenho que modificar a fonte de bootstrap, o que eu realmente não quero. Então, antes de tocar na fonte, quero saber se há alguma boa alternativa? se não, como mudar a fonte para o impacto mínimo de bootstrap?

obrigado por qualquer ideia.

Aqui está uma maneira de manter o dropdown aberto após o clique …

$('#myDropdown').on('hide.bs.dropdown', function () { return false; }); 

Demonstração: http://www.bootply.com/116350

Outra opção é manipular o evento click como este ..

 $('#myDropdown .dropdown-menu').on({ "click":function(e){ e.stopPropagation(); } }); 

Demonstração: http://www.bootply.com/116581

A resposta aceita é muito útil. Eu quero fornecer uma outra perspectiva – quando um menu suspenso deve permanecer aberto quando apenas alguns itens são clicados.

 // A utility for keeping a Bootstrap drop down menu open after a link is // clicked // // Usage: // //  $(".dropdown .dropdown-menu a").on("click", function(e) { var keepMenuOpen = $(this).data("keep-menu-open"), $dropdown = $(this).parents(".dropdown"); $dropdown.data("keep-menu-open", keepMenuOpen); }); $(".dropdown").on("hide.bs.dropdown", function(e) { var keepMenuOpen = $(this).data("keep-menu-open"); $(this).removeData("keep-menu-open"); return keepMenuOpen !== true; }); 

Em baunilha JS

 document.getElementById('myDropdown').addEventListener('click', function (event) { event.stopPropagation(); }); 
Intereting Posts