Twitter Menu di avvio Bootstrap/piccoli dispositivi: chiude/comprimi menu facendo clic su una voce di menu

Question

Desidero modificare il comportamento del menu di avvio di Twitter su dispositivi di piccole dimensioni per chiudere il menu espanso facendo clic su una voce di menu o facendo clic sul menu pulsante. Attualmente (impostazione predefinita), posso solo comprimerlo facendo clic sul pulsante del menu nell'angolo in alto a destra, indipendentemente dal fatto che avessi fatto clic su un collegamento/voce di menu o meno. Come potrei farlo? Non riesco a capirlo dalla documentazione della TB e la ricerca su Internet non ha fornito alcuna risposta.

Answer 1

si può provare qualcosa di simile ..

$('.nav li a').on('click',function(){ 
    $('.nav-collapse').collapse('hide'); 
}) 

Questo funziona per i collegamenti di menu che fa riferimento '#'. Il menu dovrebbe già collassare se i collegamenti del menu navigano verso un'altra pagina del sito, poiché ciò comporterebbe un aggiornamento completo della pagina.

Answer 2

Grazie per la correzione Skelly. Ha funzionato benissimo nel menu "mobile", ma sfortunatamente causava un difetto visivo nella modalità "desktop" perché era il targeting .nav-collapse e questa classe è attiva in entrambe le modalità. Così, ho fatto una piccola modifica:

$('.nav li a').on('click',function(){ 
    $('.navbar-collapse.in').collapse('hide'); 
}) 

Questa modifica invocherà solo le funzionalità 'nascondere' quando il menu è in modalità "mobile".

Nota: Questa è testato solo su Bootstrap 3.

Answer 3

È possibile farlo usando HTML, aggiungere data-toggle="collapse" data-target=".in" per ancorare

Esempio:

<li><a href="#" data-toggle="collapse" data-target=".in">Link</a></li>