Why wont Twitter bootstrap Carousel slide?

问题

Hello I am working with the Carosuel for bootstrap. The problem in that my pictures will not change. My browser url changes when I click the next arrow. It goes from http://0.0.0.0:3000 to http://0.0.0.0:3000/#myCarousel. Here is my code :

<script type="text/javascript">
  $(document).ready(function() {
    $('.carousel').carousel({
      interval: 1200
    })
  });
</script>


<div id="myCarousel" class="carousel slide">
  <ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
    <li data-target="#myCarousel" data-slide-to="1"></li>
    <li data-target="#myCarousel" data-slide-to="2"></li>
  </ol>
  <!-- Carousel items -->
  <div class="carousel-inner">
    <div class="active item"><%= image_tag 'picone.png' %></div>
    <div class="item"><%= image_tag 'pictwo.png' %></div>
    <div class="item"><%= image_tag 'rails.png' %></div>
  </div>
  <!-- Carousel nav -->
  <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
  <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
</div>

来源：https://stackoverflow.com/questions/16683158/why-wont-twitter-bootstrap-carousel-slide