Close responsive navbar automatically

Question

Working solution for bootstrap 3

$('.navbar-collapse a').click(function(){
    $(".navbar-collapse").collapse('hide');
});

Edit: As Maximus points out below, the 3.x bootstrap solution is:

$('.navbar-collapse a').click(function(){
    $(".navbar-collapse").collapse('hide');
});

https://jsfiddle.net/yohuLuj2/

---

Old Answer for 2.x bootstrap:

You should be able to do that by adding a click handler to the list items and then closing the nav that way.

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

Heres a jsfiddle: http://jsfiddle.net/hajpoj/By6ym/4/

I just replicate the 2 attributes of the btn-navbar (data-toggle="collapse" data-target=".nav-collapse") on each link like this:

<div class="nav-collapse">
  <ul class="nav" >
    <li class="active"><a href="#home" data-toggle="collapse" data-target=".nav-collapse">Home</a></li>
    <li><a href="#about" data-toggle="collapse" data-target=".nav-collapse">About</a></li>
    <li><a href="#portfolio" data-toggle="collapse" data-target=".nav-collapse">Portfolio</a></li>
    <li><a href="#services" data-toggle="collapse" data-target=".nav-collapse">Services</a></li>
    <li><a href="#contact" data-toggle="collapse" data-target=".nav-collapse">Contact</a></li>
  </ul>
</div>

Only thing I'd add to jason's solution is the exception for dropdowns. You don't want to close your menu if someone is simply clicking to toggle the submenu. So…

$('.navbar-collapse a:not(.dropdown-toggle)').click(function(){
    $(".navbar-collapse").collapse('hide');
});

@Mike's dropdown solution worked for me except that the items within the dropdown toggle wouldn't hide the menu so I made sure to add this:

$('.navbar-collapse .dropdown-menu').click(function(){
    $(".navbar-collapse").collapse('hide');
});